从控制器控制角度指令

时间:2015-06-16 05:54:33

标签: javascript angularjs twitter-bootstrap angularjs-directive twitter-bootstrap-3

我有一个角度指令,其作用类似于登录弹出窗口。该指令打开一个弹出页面。

modal = angular.module('Directive.Modal',[]);



modal.directive('modalLogin',function()
{   
    return {

      restrict: 'EA',
      scope:true,
      scope :
      {
        header : "=",
        callback : "&",
        email : "=",
        password : "=",
        button : "=",
        show : "&"
      },
      templateUrl: 'directiveTemplate/modalWelcome.html',
      link : function(scope,element,attrs)
      {
            scope.$watch("show",function()
            {
                console.log("Inner Function Clicked");

            });
       }

      }


});

然而,在使用bootstrap.ui后,我看到我可以直接从我的控制器使用一个衬垫调用模态。这是我想要实现的,我如何使用控制器中的一个衬垫创建模态/自定义模态。

以下代码在我的html中

<!-- Login PopUP Modal Directive -->
<modal-login 
header="ModalPageHeader"  
email="ModalPageEmail"
password="ModalPagePass"
button="ModalPageButton"
ng-click="getAuth()" 
></modal-login>

以下是控制器中的代码

app.controller('indexGlobalCtrl', function($scope,$location,ngDialog) {


    $scope.ModalPageHeader ="Login Page";
    $scope.ModalPageEmail ="Username As E-Mail";
    $scope.ModalPagePass = "Password";
    $scope.ModalPageButton = "Login";

 //   $scope.dismiss();


    $scope.getAuth = function()
    {
        alert("sd");
        $scope.show = !$scope.show;

    };
}

这是我创建的指令。虽然我可以使用ng-show和ng-hide但我的要求是创建一个单一的API,其中一个切换模态。 1.我如何以编程方式控制它

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

你不需要创建一个指令来打开一个模态。你可以通过使用如角度ui.bootstrap中提到的$ modal.open()从控制器打开它。 以下是角度ui.bootstrap文档https://angular-ui.github.io/bootstrap/

的链接