3

他のビューで使用する必要がある配列を含むカスタム ディレクティブを作成しました。たとえば、別のコントローラーでその値を使用する必要があるディレクティブ コンテンツに入力ボックスがあるとします。ng-model を使用しようとしましたが、成功しませんでした。

ここに私のコントローラーがあります:

angular.module("demo", []);

angular.module("demo").controller("demoController", function ($scope) {
    $scope.name = "John";
});

angular.module("demo").controller("directiveController", function ($scope) {

    $scope.name = "John Doe";

});


angular.module("demo").directive("passVariable", function () {
    return {
        restrict: 'AEC',
        require: "ngModel",
        templateUrl: "content.html",
        link: function (scope, element, attr, ngModel) {
            scope.$watch(function () {
                return ngModel.$modelValue;
            },
            function (modelValue) {
                console.log(modelValue);       
            });

        }
    }
});

および HTML ファイル:

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@1.4.0-beta.5" data-semver="1.4.0-beta.5" src="https://code.angularjs.org/1.4.0-beta.5/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
  </head>

  <body ng-app="demo" ng-controller="demoController">
    <div>
      <pass-variable ng-model="name"></pass-variable>
    </div>
    <br />
    <div>
        Second directive textbox:       <input type="text" ng-model="name" pass-variable="" />
    </div>
    <br />
    <div>
        Main textbox:       <input type="text" ng-model="name" />
    </div>
  </body>

</html>

および content.html

<div ng-controller="directiveController">
    Content Textbox: <input type="text" ng-model="name"/>
</div>

ここに私のプランカーがあります: http://embed.plnkr.co/rzlUQM6FBI3Sll4F8WaG/preview

ところで、plunker が content.html をロードしない理由がわかりません

更新私は、コントローラーの in ディレクティブを追加し、 in を削除する必要があることを理解しましcontroller: directiveControllerng-controller='directiveController'content.html

4

2 に答える 2

0

$parent.name以下のようにしてみてください

<div ng-controller="directiveController">
    Content Textbox: <input type="text" ng-model="$parent.name"/>
</div>
于 2015-08-12T15:10:07.140 に答える