Command continued & lt; AngularJs & gt;, command continued angularjs

Command continued <AngularJs>, command continued angularjs
Compile [object or function]

The compile option is not frequently used, but the link function is often used. Essentially, when we set the link option, we actually created a postLink () link function so that the compile () function can define a link function. Generally, if the compile function is set, we want to perform DOM operations before the commands and real-time data are put into the DOM, it is safe to perform DOM operations such as adding and deleting nodes in this function.

The compile and link options are mutually exclusive. If both options are set, the functions returned by compile are treated as link functions, while the link options are ignored.
Compile the function to convert the template DOM. The linked function is responsible for linking the scope and DOM.. You can manually operate the DOM before the scope is the same as the DOM link. In practice, this operation is rare when writing custom commands, but several built-in commands provide this function.

Link

Compile: function (tEle, tAttrs, transcludeFn) {// todo: return function (scope, ele, attrs) {// link function };

The linked function is optional.If a compilation function is defined, it returns the linked function.Therefore, when both functions are defined, the compilation function will overload the linked function. If our commands are simple and no additional settings are required, you can return a function from the factory function (callback function) to replace the object. If this is done, this function is a link function.

NgModel

It provides a more underlying API to process data in the Controller. This API is used to handle data binding, verification, CSS update, and other non-actual DOM operations, the ngModel controller will be injected into the instruction along with the ngModel, which contains some methods. To access ngModelController, you must use require settings.
NgModelController has the following elements:

• 1. To set the view value in the scope, call the ngModel. $ setViewValue () function.

The $ setViewValue () method is suitable for listening to custom events in custom commands (for example, using jQuery plug-ins with callback functions). We want to set $ viewValue during callback and execute the digest loop.

Angular. module ('myapp'). directive ('myctive', function () {return {require :'? Ngmodel', link: function (scope, ele, attrs, ngModel) {if (! NgModel) return; $ (function () {ele. datepicker ({
// Callback function onSelect: function (date) {// sets the view and calls apply scope. $ apply (function () {ngModel. $ setViewValue (date );});}});});}};});

• 2. The $ render method can define the specific rendering mode of the view.
• 3. Attributes
  1.$ ViewValue
  The $ viewValue attribute stores the actual strings required to update the view.
  2.$ ModelValue
  $ ModelValue is held by the data model. $ ModelValue and $ viewValue may be different depending on whether the $ parser pipeline operates on them.
  3.$ Parsers
  $ Parsers is an array composed of functions. functions are called one by one in the form of pipelines. The values read from the DOM by ngModel are passed into the $ parsers function and processed by the parser in sequence.
  4.$ Formatters
  $ Formatters is an array composed of functions. functions are called one by one when the values of the data model change in the form of pipelines. It does not affect the $ parser pipeline, and is used to format and convert the value so that it can be displayed in the control bound to this value.
  5.$ ViewChangeListeners
  $ ViewChangeListeners is an array composed of functions. functions in this array are called one by one when the values in the view change in the form of pipelines. With $ viewChangeListeners, You can implement similar behavior without using $ watch. The returned values are ignored, so these functions do not need to return values.
  6.$ Error
  The $ error object contains the name of the validators that have not passed the verification and the corresponding error information.
  7.$ Pristine
  The value of $ pristine is Boolean, which indicates whether the control has been modified.
  8.$ Dirty
  The value of $ dirty is the opposite of that of $ pristine, which tells us whether the user has interacted with the control.
  9.$ Valid
  The $ valid value indicates whether an error exists in the current control. If there is an error, the value is false, and the value is true if there is no error.
  10.$ Invalid
  The $ invalid value indicates whether at least one error exists in the current control. Its value is opposite to $ valid. To be continued ....

Note: I have just started my study. This article is not a good summary. I need to know many details and review them again. If you like this article,RecommendationThank you!