角度 - 基础模态错误

时间:2016-06-06 08:09:50

标签: angularjs typescript angular-foundation

我有一个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()">&#215;  </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());
      });
    }

这是我得到的错误: Error

信息:我有模块&#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我相信问题出在我的控制器中,但我仍然不知道如何解决它。

1 个答案:

答案 0 :(得分:0)

我明白了!

故障发生在应用程序的另一部分,我创建了一个使用tabset类基础的导航栏,并且与角度基础发生冲突。