我有一个Angular Js - Typescript项目。我尝试使用Angular-Foundation开发模态,但它无效。
这是我的代码:
HTML
<div>
<script type="text/ng-template" id="myModalContent.html">
<h3>I'm a modal!</h3>
<ul>
<li ng-repeat="item in vm.items">
<a ng-click="selected.item = item">{{ vm.item }}</a>
</li>
</ul>
<p>Selected: <b>{{ selected.item }}</b></p>
<button class="button secondary" ng-click="reposition()">Reset top position</button>
<a class="close-reveal-modal" ng-click="vm.cancelModal()">× </a>
</script>
<button class="button" ng-click="vm.openModal()">Open me!</button>
<div ng-show="selected">Selection from a modal: {{ selected }} </div>
</div>
控制器
public items: any[];
constructor(private $modal: any){
this.items = ["item1", "item2", "item3"];
}
public openModal() {
let modalInstance = this.$modal.open({
templateUrl: "myModalContent.html",
controller: "MissionsCtrl",
resolve: {
items: function () {
return this.items;
}
}
});
modalInstance.result.then(function (selectedItem) {
this.selected = selectedItem;
}, function () {
console.log("Modal dismissed at:" + new Date());
});
}
信息:我有模块&#34; mm.foundation&#34;包含在app.ts中,以及在index.html中正确引用的JS文件(mm-foundation.min.js和mm-foundation-tpls.min.js)。
最终,有人知道如何在不使用角度基础的情况下使用AngularJS和Typescript实现模态?
我不知道问题出在哪里。
提前致谢!
修改
我添加了我的app.ts文件:
(function(){
"use strict";
angular.module("MyApp", [
"ngSanitize",
"pascalprecht.translate",
"color.picker",
"ui.router",
"mm.foundation",
"app.core",
]);
})();
阅读Angular Docs我相信问题出在我的控制器中,但我仍然不知道如何解决它。
答案 0 :(得分:0)
我明白了!
故障发生在应用程序的另一部分,我创建了一个使用tabset类基础的导航栏,并且与角度基础发生冲突。