Question

我有日历应用。初始化后一切正常。问题是在我更改模型（月份）后，指令不会更新新创建的元素。

观点部分：

<li class="day" ng-repeat="n in [] | range:month.daysInMonth()">    
    <span class="day-number" calendar-day="{{ n }}-{{ month.format('MM-YYYY') }}">{{ n }}</span>
</li>

指令：

directive('calendarDay', ['month', function (month) {
    return function (scope, element, attrs) {
       scope.$watch(month, function (value) {
           var currentDate = moment(attrs.calendarDay, "DD-MM-YYYY");
           element.text(currentDate.format('DD-MM-YYYY'));
       });

    };
}]);

模型month是在app中声明为：

的模型

value('month', moment());

以下是代码：http://jsfiddle.net/EEVGG/11/

正如您所见，代码的月份和年份部分没有变化，而应该是因为calendar-day属性中的值是正确的。

Answer 1

您希望监视范围属性“月”的更改，而不是您在模块上定义的月对象。为此，请将 watchExpression 更改为'month'（字符串）：

scope.$watch('month', function (value) {
    var currentDate = moment(attrs.calendarDay, "DD-MM-YYYY");
    element.text(currentDate.format('DD-MM-YYYY'));
}, true);

还设置观察者根据对象相等性（$watch的最后一个参数）比较更改，因为月份对象将相同，只有一些属性会发生变化。有关此检查的更多信息$watch documentation。

jsfiddle ：http://jsfiddle.net/bmleite/EEVGG/12/

AngularJS - 指令在模型更新后不触发

1 个答案: