Exemple de partage de code sur la boîte modale angulaireJS $modal-js tutoriel-php.cn

Exemple de partage de code sur la boîte modale angulaireJS $modal

黄舟

Libérer： 2017-05-27 10:29:32

original

1580 Les gens l'ont consulté

Cet article présente principalement l'exemple de code $modal de la boîte modale angular JS L'éditeur pense qu'il est plutôt bon, je vais donc le partager avec vous maintenant et le donner en guise de modèle. référence. Suivons l'éditeur et jetons un coup d'œil

1 Présentons le module $modal

tel que :

angular.
module
(&#39;ModalCtrl&#39;,[&#39;$modal&#39; ,&#39;$scope&#39; , function($modal ,$scope ){ }]);

Copier après la connexion

<. 🎜>2 .Exécuter la fonction de boîte modale

$scope.editModule = function(type, size, id) { 
  $scope.id = id; 
  var modalInstance = $modal.open({ 
    templateUrl: &#39;tpl/weichat_modulebaseinfo.html&#39;, //template:&#39;html元素模板&#39;, 
    controller: &#39;EditModuleCtrl&#39;, // 初始化模态范围 
    size: size, //大小配置 
    scope: &#39;一个作用域为模态的内容使用（$modal会创建一个当前作用域的子作用域,scope可有可无）默认为$rootScope&#39;, 
    resolve: { 
      items: function() { 
        return $scope.id; //向模态框控制器中传值 
      } 
    } 
    background: &#39;&#39;, //控制背景，true(有) or false(无)，static背景存在，但是点击模态窗口之外，模态窗不关闭 
    keyboard: &#39;&#39;, //按下Esc时，模态对话框是否关闭，默认为ture 
    windowClass: &#39;&#39; //指定一个class并被添加到模态窗口中 
 
  }); 
 
  modalInstance.result.then(function(selectedItem) { //模态框关闭后返回函数，selectedItem为返回值 
 
  }) 
}

Copier après la connexion

3. Créer un contrôleur de boîte modale

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!