Question

在我的模态模板中，我试图使用ng-model为我的控制器（$scope.name）的范围赋值，但它不起作用。它给了我undefined。我究竟做错了什么？ Plunker here

我希望模态创建自己的范围，并将name放入该范围，因为我使用了ng-model。它似乎在模态控制器中是活动的，因为我可以使用{{name}}

输出它

<div ng-controller="ModalDemoCtrl">
    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-body">
            Name: <input type="text" ng-model="name">
        </div>
        <div class="modal-footer">
            <button class="btn btn-primary" ng-click="ok()">OK</button>
        </div>
    </script>
    <button class="btn" ng-click="open()">Open me!</button>
</div>

使用Javascript：

angular.module('plunker', ['ui.bootstrap']);
var ModalDemoCtrl = function ($scope, $modal, $log) {    
  $scope.open = function () {
    var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: ModalInstanceCtrl
    });
  };      
};

var ModalInstanceCtrl = function ($scope, $modalInstance) {    
  $scope.ok = function () {
    $modalInstance.close($scope.name);
    alert('name was: ' + $scope.name)
  };    
  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };      
};

Answer 1

模型name是在不同的范围内创建的。使用对象：

var ModalInstanceCtrl = function ($scope, $modalInstance) {
    $scope.data = {
        name:""
    };
    $scope.ok = function () {
        alert('name was: ' + $scope.data.name);
        $modalInstance.close($scope.data.name);
    };

的 Plunk

在angular-ui模态控制器内的ng-model输入是未定义的

1 个答案: