AngularJS、ui-router 和引导模式答案

【问题标题】：AngularJS, ui-router and bootstrap modalAngularJS、ui-router 和引导模式
【发布时间】：2015-10-01 20:19:01
【问题描述】：

在选择选项时显示模式窗口存在一些问题

HTML

<!DOCTYPE html>
<html ng-app="myApp">
<body>
    <div ui-view></div>
</body>

</html>

应用控制器

angular.module('myApp', ['ui.router'])
.config(['$urlRouterProvider', '$stateProvider', function($urlRouterProvider, $stateProvider){
            $urlRouterProvider.otherwise('/');
            $stateProvider
            .state('home',{
                url: '/',
                templateUrl: 'contacts.html',
                controller: 'myCtrl'
        })
    }])

家庭控制器

angular.module('myApp', [])
.controller('myCtrl', function($http, $scope) {
  $http.get('test.json').success(function (data) {
     $scope.selected = data;
  });
});

contacts.html

<select ng-model="selectedRegion" data-ng-options="location for location in selected.regions">
    <option value="">Region</option>
</select>
<select ng-model="selectedCountry" data-ng-options="place for place in selected.countries[selectedRegion]">
    <option value="">Country</option>
</select>
        {{selectedRegion}}

如何制作一个模态窗口，在选择相关区域或国家后，我可以在其中显示，例如 {{selectedRegion}}？请帮忙，我尝试注入 ['ui.bootstrap']，并且 ng-click on button 工作正常。但是如何使用选择来做到这一点？谢谢

这里是Plunk

【问题讨论】：

但是演示中没有可用的模式，并且由于两次声明相同的模块，演示被破坏了。使用ng-change 来询问您的问题
是的，抱歉坏了，错过了。感谢您的帮助，我尝试使用 ng-click 指令来制作它，发现它应该使用 select 应用 ng-change 指令

标签： angularjs angular-ui-router angular-ui-bootstrap

【解决方案1】：

有一些工作要做，从你给的大手笔。

在 home.js 中将 angular.module('myApp', []) 替换为 angular.module('myApp')
在国家/地区列表中添加ng-change。
在更改时，我们将打开一个模式

Plunker

添加 ui.bootstrap 作为模块依赖项，用于模态

【讨论】：

非常感谢，很抱歉没能正常工作，错过了