【问题标题】:How to execute ng-change after loading data on custom directive在自定义指令上加载数据后如何执行 ng-change
【发布时间】:2017-04-11 00:05:55
【问题描述】:

我在 plnkr 中使用 Angular js 编写了一个自定义指令, 加载指令时,它已经在 MainCtrl 上调用了 changed() 函数,我需要停止 changed() 函数,直到数据加载到指令中,之后,它应该开始观察指令内的输入变化和顺便说一句,changed() 函数应该在 MainCtrl 中,因为它在 example 中,所以在将数据加载到指令之前有什么方法可以停止执行 ng-change? 这是代码:

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = "someName";
  $scope.statusText = "unChanged";
  $scope.changed = function(){
          $scope.statusText = "changed";
      };
});


app.directive("myDirective", function () {
    return {
        restrict: 'EA',
        scope: {
            ngModel: "=",
            ngChange: "="
        },
        templateUrl: "template.html",
        link: function ($scope, elem, attrs) {



        }
    }
});
<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">

    <my-directive ng-model="name" ng-change="changed()"></my-directive>
    <p>{{statusText}}</p>

    <script type="text/ng-template" id="template.html">
      <input type="text" ng-model="ngModel" ng-change="ngChange" >
    </script>
  </body>

</html>

【问题讨论】:

    标签: javascript angularjs angular-directive angularjs-ng-change


    【解决方案1】:
    • 您必须更改指令的接收属性ngModel 和ngChange,它与angularhs 的内置指令冲突。
    • 如果要在指令之外调用函数,请使用 '&'

    参考这个plunker(我刚刚从你的问题中分出)。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-09-25
      • 1970-01-01
      • 2015-12-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-05-05
      • 1970-01-01
      相关资源
      最近更新 更多