Question

这是我的指令代码：

'use strict';

demo.directive('myModal', function($parse) {
    return {
        restrict: 'A',
        transclude: true,
        scope: '@',
        template: '<div ng-transclude><h4>Please enter value</h4></div>'
    }
});

用法如下：

<!-- myModal directive -->
<div my-modal>
  <input type="text" ng-model="myTest" />
  <input type="button" ng-click="getMyTest()" value="Get Value" />
</div>

我的主控制器包含整个应用程序，包括：

demo.controller('MainCtrl', function($scope) {

  $scope.getMyTest = function(){
    alert($scope.myTest);
  }

});

任何想法导致我无法访问myTest?

JsFiddle：http://jsfiddle.net/sZZEt/679/

Answer 1

试试这个。将指令添加到模型元素。

gets_s()

Answer 2

你应该使用点符号：

demo.controller('MainCtrl', function($scope) {
    $scope.data = {};

    $scope.getMyTest = function(){
    alert($scope.data.myTest);
  }
});

和

<div my-modal>
  <input type="text" ng-model="data.myTest" />
  <input type="button" ng-click="getMyTest()" value="Get Value" />
</div>

JSFIDDLE

Transclusion会创建子范围，这就是为什么要对ng-model使用点符号的原因。

Angular transcluded指令 - 无法访问其内部的模型

2 个答案: