动态生成MobileAngularUI情态动词 [英] Dynamically generate modals with MobileAngularUI

问题描述

我现在用的手机角UI框架，我的移动web应用程序。

I am using the Mobile Angular UI framework for my mobile web-app.

本页解释该指令关于如何生成情态动词（他们稍微改变引导框架）

This Page explains the directive on how to generate modals (they slightly change the bootstrap framework)

我设法复制的例子，但是当我换了NG-重复指令生成多个情态动词，它不工作更多的

I manage to reproduce the example, however when I wrap the directive in a ng-repeat to generate multiple modals, it is not working any more

  <div ui-content-for="modals">
    <div   ng-repeat="p in UseCaseCtrl.getProjects()" >
      <div class="modal" ui-if="modal{{ p.getId() }}" ui-state="modal{{ p.getId() }}">
        <div class="modal-backdrop in"></div>
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button class="close" 
                      ui-turn-off="modal{{ p.getId() }}">&times;</button>
              <h4 class="modal-title">{{ p.getName() }}</h4>
            </div>
            <div class="modal-body">

                ...Lorem...

            </div>
            <div class="modal-footer">
              <button ui-turn-off="modal{{ p.getId() }}" class="btn btn-default">Close</button>
              <button ui-turn-off="modal{{ p.getId() }}" class="btn btn-primary">Save changes</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>        

据我经验，这个问题似乎来自UI状态=模式{{p.getId（）}}，因为它再次工作时，我很难code只有一个（即设置UI -state =modal1）

As far as I experienced, the problem seems to come from ui-state="modal{{ p.getId() }}, as it works again when I hardcode only that one (i.e., set ui-state="modal1")

我缺少的东西吗？任何变通方法生成纳克重复情态动词？

Am I missing something? Any workaround to generate modals with ng-repeat?

感谢

推荐答案

我用 NG-点击=使用functionName（p.getId（））的控制器，而不是 UI的导通=模式{{p.getId（）}} 。

I use ng-click = "functionName(p.getId()) in controller instead of ui-turn-on="modal{{ p.getId() }}.

详细内容：

$scope.functionName = function (id) {
    SharedState.initialize($rootScope, 'modal'+id); 
    $rootScope.Ui.turnOn( 'modal'+id);
}; 

请注意：你需要在控制器注入对sharedState

note: you need injection SharedState in controller.

我做到了，成功！

这篇关于动态生成MobileAngularUI情态动词的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！