AngularJS: স্বয়ংক্রিয়ভাবে মডেল পরিবর্তন সনাক্ত

Question

মনে করুন আমি যখনই কোনও মডেলের মান পরিবর্তন করি তখন কিছু কোড স্বয়ংক্রিয়ভাবে চালাতে (সার্ভারে ডেটা সংরক্ষণের মতো) কিছু করতে চাইতাম। ng-changeপ্রতিটি নিয়ন্ত্রণে এমন কিছু স্থাপনের মাধ্যমে এটি করার একমাত্র উপায় যা সম্ভবত মডেলটিকে পরিবর্তন করতে পারে?

উদাহরণস্বরূপ, দৃশ্যের সাথে জিনিসগুলি ঠিক বদলে যায় কারণ মডেলটি পরিবর্তিত হয়ে কোনও কিছুকে স্পষ্টভাবে না ঝোঁক করে changed কোনও সার্ভারে সংরক্ষণ করে এমন কোড চালাতে সক্ষম হওয়ার কোনও এনালগ রয়েছে কি? কিছুটা এইরকম

myModel.on('change', function() {
  $.post("/my-url", ...);
});

যেমন আপনি ব্যাকবোন মত কিছু সঙ্গে দেখতে পাবেন।

Answer 1

সঙ্গে দেখার {{}}এবং / অথবা NG-মডেল, কৌণিক স্থাপন করছে $watch()লোকচক্ষুর অন্তরালে তোমার জন্য স্প্যানিশ ভাষায়।

ডিফল্টরূপে $watchরেফারেন্সের সাথে তুলনা করে। আপনাকে তৃতীয় প্যারামিটারটি সেট করেন তাহলে $watchথেকে true, কৌণিক পরিবর্তে "অগভীর" পরিবর্তনের জন্য বস্তু পর্যবেক্ষণ করবেন। অ্যারেগুলির জন্য এর অর্থ অ্যারে আইটেমগুলির তুলনা করা, অবজেক্ট ম্যাপের জন্য এটির বৈশিষ্ট্যগুলি দেখার অর্থ। সুতরাং এটি আপনার যা করা উচিত তা করা উচিত:

$scope.$watch('myModel', function() { ... }, true);

আপডেট : কৌণিক v1.2 এটির জন্য একটি নতুন পদ্ধতি যুক্ত করেছে, $ $ সংগ্রহশালা () :

$scope.$watchCollection('myModel', function() { ... });

নোট করুন যে "অগভীর" শব্দটি "গভীর" এর পরিবর্তে তুলনা বর্ণনা করতে ব্যবহৃত হয় কারণ রেফারেন্সগুলি অনুসরণ করা হয় না - উদাহরণস্বরূপ, যদি পর্যবেক্ষিত অবজেক্টটিতে এমন কোনও সম্পত্তি মান থাকে যা অন্য কোনও বস্তুর রেফারেন্স হয়, তবে সেই রেফারেন্সটি তুলনা করার জন্য অনুসরণ করা হয় না অন্য বিষয়।

Comments

আহ, দুর্দান্ত! এর কোনও কারণ কি এটি সমস্ত নথিবদ্ধ বলে মনে হচ্ছে না (যেমন, আমি কৌণিক সাইটে সেট আপ $ ঘড়ি প্রত্যক্ষভাবে উল্লিখিত টিউটোরিয়াল মনে করি না)? এ সম্পর্কে খারাপ কিছু আছে যা ng-changeইনপুট নিয়ন্ত্রণগুলিতে (সম্ভাব্য একাধিক) হুকগুলি আরও ভাল ধারণাটি স্থাপন করবে?

— আলেক

হ্যাঁ, মূল টিউটোরিয়ালটি উল্লেখ করা ভাল would কোথাও দেখুন nice এই পদ্ধতির সম্পর্কে "খারাপ" হ'ল এটি হ'ল সময়সাপেক্ষ হতে পারে যদি আপনার মডেলটি বড় হয় (প্রতিটি ডাইজেস্ট চক্র - একটি ইনপুট ক্ষেত্রে প্রতিটি কীস্ট্রোক - এর ফলে এই মডেলটি গভীর নোংরা-পরীক্ষিত হয়, সম্ভবত একাধিকবার) । সেক্ষেত্রে সিলেক্টিক $ ওয়াচ () এস বা সিলেক্ট এনজি-চেঞ্জ আরও ভাল হবে।

— রাজকোক

Answer 2

এবং যদি আপনাকে আপনার ফর্ম উপাদানগুলির স্থিতি অনুসারে স্টেট করতে হয় (পরিবর্তিত / সংশোধিত নয়) গতিশীলভাবে বা কিছু মানগুলি আসলে পরিবর্তিত হয়েছে কিনা তা পরীক্ষা করতে আপনি নিজের দ্বারা তৈরি নীচের মডিউলটি ব্যবহার করতে পারেন: https://github.com/betsol / কৌণিক-ইনপুট-রুপান্তরিত

এটি ফর্মটিতে অতিরিক্ত বৈশিষ্ট্য এবং পদ্ধতি যুক্ত করে এবং এতে শিশু উপাদান রয়েছে। এটির সাহায্যে আপনি পরীক্ষা করতে পারবেন যে কোনও উপাদানটিতে নতুন ডেটা রয়েছে কি না এমনকি পুরো ফর্মটিতে নতুন সংরক্ষিত ডেটা রয়েছে কিনা তা পরীক্ষা করতে পারে।

আপনি নীচের ঘড়িটি সেটআপ করতে পারেন: $scope.$watch('myForm.modified', handler)এবং যদি কিছু ফর্ম উপাদানগুলিতে আসলে নতুন ডেটা থাকে বা এটি প্রাথমিক অবস্থায় বিপরীত হয় তবে আপনার হ্যান্ডলারটি কল করা হবে।

এছাড়াও, আপনি modifiedএজেএক্স কলের মাধ্যমে কোনও সার্ভারে প্রেরিত ডেটার পরিমাণ হ্রাস করতে স্বতন্ত্র ফর্ম উপাদানগুলির সম্পত্তি ব্যবহার করতে পারেন । অপরিবর্তিত ডেটা প্রেরণের দরকার নেই।

বোনাস হিসাবে, আপনি ফর্মের reset()পদ্ধতিতে কলের মাধ্যমে আপনার ফর্মটি প্রাথমিক অবস্থায় ফিরিয়ে দিতে পারেন ।

আপনি মডিউলটির ডেমোটি এখানে পেতে পারেন: http://plnkr.co/edit/g2MDXv81OOBuGo6ORvdt?p= পূর্বরূপ

চিয়ার্স!

Comments

নিয়ামকটিতে এটি পরীক্ষা করার কোনও উপায় আছে কি? উদাহরণস্বরূপ, যদি ক্লিক করুন এক্স বোতামটি যদি আমি (মাইফর্ম.মোডিফায়েড) নিশ্চিতকরণ পপআপ প্রদর্শন করতে পারি তবে?

— ফ্ল্যাশ

অবশ্যই, আপনার নিয়ামকের ফাংশনে কেবলমাত্র ফর্মকন্ট্রোলারটি পাস করুন: <form name="myForm">, <button ng-click="vm.doSomething(myForm)">।

— স্লাভা ফমিন ২ য়

ধন্যবাদ, যদি ফর্মটি ঠিকঠাক করা হয় তবেই এটি কিছু করবে?

— ফ্ল্যাশ

এই পাস হবে FormControllerথেকে doSomething()আপনার নিয়ন্ত্রকের ফাংশন। That ফাংশনের অভ্যন্তরে আপনি এটি দিয়ে যা কিছু করতে পারেন, উদাহরণস্বরূপ FormController.modifiedबुুলিয়ান সম্পত্তি যাচাই করে ফর্মটি আসলে সংশোধিত হয়েছে কিনা তা পরীক্ষা করে দেখুন ।

— স্লাভা ফমিন দ্বিতীয়

ধন্যবাদ! দুর্দান্ত বৈশিষ্ট্য

— ফ্ল্যাশ