Entschuldigung, wenn einige der JS ist syntaktisch ausgeschaltet. Ich habe es geschrieben, während an meinem Coffee suchen
Ich habe einen Texteditor, dass ich in eine Richtlinie extrahiert habe, und ich möchte einige Zustand zwischen ihm teilen und die darin enthaltenen Vorlage:
Haupt enthält Vorlage
<div class="content">
<editor class="editor" ng-model="foo.bar.content" text-model="foo.bar"></editor>
</div>Template-Controller
angular.module('foo').controller('fooController', ['$scope', ... , function ($scope, ...) {
$scope.foo = {}
$scope.foo.bar = {}
$scope.foo.bar.content = 'starting content'
$scope.$watch('foo.bar', function() {
console.log('content changed')
}, true)
}Die Vorlage Zwei-Wege-$scope.foo.bar mit dem Editor-Richtlinie über deren Anwendungsbereich Objekt bindet. Wenn der Text geändert wird, wird der Textänderungshandler des Editors ausgelöst und eine Eigenschaft für das gebundene Objekt wird geändert.
Editor Richtlinie
angular.module('foo').directive('editor'), function (
restrict: 'E',
templateUrl: 'path/to/editor.html',
require: 'ng-model',
scope: {
textModel: '='
},
controller: [
...
$scope.editor = 'something that manages the text'
...
],
link: function (scope, ...) {
scope.editor.on('text-change', function() {
$scope.textModel.content = scope.editor.getText()
// forces parent to update. It only triggers the $watch once without this
// scope.$parent.$apply()
}
}jedoch in der Richtlinie die Änderung dieser Eigenschaft scheint nicht die tiefe $ Uhr zu schlagen ich auf foo.bar festgelegt haben. Nach einigen Ausgrabungen konnte ich mit der Elternreferenz der Direktive einen $ Digest-Zyklus scope.$parent.$apply() erzwingen. Ich sollte das wirklich nicht brauchen, da die Eigenschaft geteilt wird und automatisch ausgelöst werden sollte. Warum wird es nicht automatisch ausgelöst?
Hier sind einige gute Messwerte, die ich erlebt habe, die relevant sind:
$watch an object
https://www.sitepoint.com/understanding-angulars-apply-digest/