问题NG-点击和NG-显示

Question

我试图做一个小的模态框架在我的应用程序..

继承人我的控制器：

function ModalCtrl($scope){ 
    $scope.openModal = function(name){ 
     $scope.modalStatus = true; 
    } 
    $scope.closeModal = function(name){ 
     $scope.modalStatus = false; 
    } 
    $scope.modal = function(){ 
     return $scope.modalStatus; 
    } 
    $scope.modalStatus = false; 
} 

而且继承人的HTML：

<div ng-controller="ModalCtrl"> 
    <div ng-show="modal()" class="modal_window"> 
    <h2>The title</h2> 
    <span>The content</span> 
    <a ng-click="closeModal()">Close</a> 
    </div> 
</div> 

<div ng-controller="ModalCtrl"> 
    <a ng-click="openModal('xyz')">Open it up</a> 
</div> 

只是完全不工作..不能更糊涂

编辑：用的jsfiddle更新：http://jsfiddle.net/TeYfY/

Answer 1

我还没有详细检查过你的代码，但是你的ngClick被定义为以外的ngController，所以它无法访问openModal函数。你会需要它的控制器内部的范围，如访问方法：

<div ng-controller="ModalCtrl"> 
    <div ng-show="modal()" class="modal_window"> 
    <h2>The title</h2> 
    <span>The content</span> 
    <a ng-click="closeModal()">Close</a> 
    </div> 

    <a ng-click="openModal('xyz')">Open it up</a> 
</div> 

如果还有比这更多的问题，请随时发布Plunker或的jsfiddle和更新您的问题，我会很高兴仔细观察并修改我的答案。

PS：此代码属于指令。

更新

在评论中提到，他要控制从其他位置的模态的OP。这通常是完成与服务：

module.factory('ModalService', function() { 
    var is_visible = false; 

    return { 
    isVisible: function (value) { 
     if (angular.isDefined(value)) { 
     is_visible = value; 
     } else { 
     return is_visible; 
     } 
    } 
    }; 
}); 

在模态指令，一个可以监听的服务状态：

$scope.$watch(ModalService.isVisible, function (status) { 
    $scope.isVisible = status; 
}); 

而从遥远的控制器，一个可以改变状态上服务：

$scope.openModal = function() { 
    ModalService.setVisible(true); 
} 

这是高度设计和过度简化，但它应该说明这一点。除了服务之外，还可以使用事件来完成组件间通信，但在大多数情况下，服务更加干净。