Question

我正在尝试使用模态（Mobile Angular JS），但我还没有找到，在我的主控制器中为我的模态设置控制器的任何方法，并传递参数。我的应用程序只是移动的，使用ui- bootstrap是错误的吗？

HTML

<div ui-content-for="title">
    <span>Employerss</span>
</div>
<div class="scrollable" ui-state="searchBar">
    <div class="scrollable-content" ui-scroll-bottom='bottomReached()'>
        <div class="list-group" style="height:80px;">
            <a ng-repeat="employers in employerss" ng-click="select(employers)" class="list-group-item">
                <p>{{employers.name | limitTo:70}}...</p>
            </a>
        </div>
    </div>
</div>
<div ui-content-for="modals">
    <div ng-include="'modal/modalemployers.html'" ng-controller="modalEmployersController"></div>
</div>

模态

<div class="modal" ui-if='modalemployers' ui-state='modalemployers'>
    <div class="modal-backdrop in"></div>
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button class="close"
                        ui-turn-off="modalemployers">
                    &times;
                </button>
                <h4 class="modal-title">Modal title</h4>
            </div>
            <div class="modal-body">
                <p>{{test}}</p>
            </div>
            <div class="modal-footer">
                <button ui-turn-off="modalemployers" class="btn btn-default">Close</button>
                <button ui-turn-off="modalemployers" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

Angular JS

 var app = angular.module('apphome', [
            "ngRoute",
            "ngTouch",
            "mobile-angular-ui",
            "mobile-angular-ui.core",
            "mobile-angular-ui.components"
        ]);
.........
.........
  app.controller('employersController', function ($scope, $http) {
            $scope.employerss = [];
            $scope.select = function (item) {
                $scope.Ui.turnOn('modalemployers');
            }

            getEmployers($http, function return(data) {
                $scope.employers = data;
            });



        });
        app.controller('modalEmployersController', function ($scope) {

            $scope.test = "teste";
        });

我需要（我很困惑，如果我可以使用bootstrap -ui，而不会危及我的应用程序，因为它只是移动。我需要知道bootstrap -ui是否会运行良好。小屏幕的手机将使用该应用程序可以不打破布局。）

$scope.select = function (item) {
  var modalInstance = $modal.open({
      templateUrl: 'modalemployers.html',
      controller: 'modalEmployersController',
      size: size,
      resolve: {
        item: function () {
          return item;
        }
      }
    });

            }

全部谢谢！

Answer 1

Angular UI Bootstrap只为Bootstrap CSS提供Angular模板和扩展。由于Bootstrap CSS支持移动设备，因此Angular UI Bootstrap库也可以。

请注意，Angular UI Bootstrap的唯一依赖项是Angular＆gt; = 1.3.x和Bootstrap CSS＆gt; = 3.x。

如何从控制器打开和设置控制器Mobile-Angular模态

1 个答案: