1
私のanglejsブートストラップモダルが開いていません。なぜAngularjsブートストラップモダルが開いていないのですか？
var app=angular.module('test', ['ui.bootstrap']);
app.controller('ModalDemoCtrl', function($scope, $log,$modal) {
$scope.user = {
user: 'name',
password: null,
notes: null
};
$scope.open = function() {
$modal.open({
templateUrl: 'myModalContent.html', // loads the template
backdrop: true, // setting backdrop allows us to close the modal window on clicking outside the modal window
windowClass: 'modal', // windowClass - additional CSS class(es) to be added to a modal window template
controller: function ($scope, $modalInstance, $log, user) {
$scope.user = user;
$scope.submit = function() {
$log.log('Submiting user info.'); // kinda console logs this statement
$log.log(user);
$modalInstance.dismiss('cancel'); // dismiss(reason) - a method that can be used to dismiss a modal, passing a reason
}
$scope.cancel = function() {
$modalInstance.dismiss('cancel');
};
},
resolve: {
user: function() {
return $scope.user;
}
}
});//end of modal.open
}; // end of scope.open function
\t
\t
});<html ng-app="test">
<head>
<script src="https://code.angularjs.org/1.2.18/angular.js"></script>
<!--<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.6.0.js"></script>-->
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="ModalDemoCtrl">
<script type="text/ng-template" id="myModalContent.html">
<div class="modal-header">
<h3>I'm a modal!</h3>
</div>
<form ng-submit="submit()">
<div class="modal-body">
<label>User name</label>
<input type="text" ng-model="user.user" />
<label>Password</label>
<input type="password" ng-model="user.password" />
<label>Add some notes</label>
<textarea rows="4" cols="50" ng-model="user.notes"></textarea>
</div>
<div class="modal-footer">
<button class="btn btn-warning" ng-click="cancel()">Cancel</button>
<input type="submit" class="btn primary-btn" value="Submit" />
</div>
</form>
</script>
<button class="btn" ng-click="open()">Open me!</button>
<div ng-show="selected">Selection from a modal: {{ selected }}</div>
</div>
</body>
</html>私はバージョンを使用する場合、私は、ブートストラップバージョン0.6.0にfine.But作業モーダルを使用している場合、それは私にエラー「不明なプロバイダを与える2.5.0：$ modalProvider < - $モーダル"しかし、私はバージョン2.5.0を使用する必要があります。どのように問題を解決するには？助けてください。進んでいただきありがとうございます。 JSの部分では
実は私はit.Youは、UI-ブートストラップ・TPLS-0.6.0.jsを使っているという意味ではありませんでした。プランナーでこのjsバージョンを使用し、コードは期待どおりに実行します。しかし、エラーを返す同じコードではなく、 ui-bootstrap-tpls-2.5.0.js –
Manを使用する必要があります.jsのjs優先順位を確認してください –