[AngularJS]TypeError︰ 无法读取属性 '开放' 的定义模型

发布时间: 2017/4/16 21:13:52
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我试图显示modal与某一项目的信息。但是当我调用该函数时它读取︰

TypeError︰ 无法读取属性 '开放' 的定义范围内.$scope.openModal

我希望有人能告诉我为什么,以下是相关代码︰

模板

<div ng-controller="View1Ctrl">
    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-header">
            <h3 class="modal-title">Item Details</h3>
        </div>
        <div class="modal-body">
            <ul ng-repeat="i in items">
                <li>Type: <span ng-bind="i.type"></span></li>
                <li>Description: <span ng-bind="i.description"></span></li>
                <li>Date: <span ng-bind="i.createDate"></span></li>
                <li>Priority: <span ng-bind="i.priority"></span></li>
                <li>Finished: <span ng-bind="i.isDone"></span></li>
            </ul>
        </div>
        <div class="modal-footer">
        <button class="btn btn-primary" ng-click="$close()">OK</button>
        </div>
    </script>
</div>

App.Js

'use strict';

// Declare app level module which depends on views, and components
angular.module('myApp', [
  //'ngRoute',
  'ui.router',
  'ui.bootstrap',
  'myApp.view1',
  'myApp.view2',
  'myApp.version',
  'myApp.items'
])
.config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/view1');

    $stateProvider  
    .state('view1', {
        url: '/view1',
        templateUrl: 'view1/view1.html',
        controller: 'View1Ctrl'
    })
    .state('view2', {
        url: '/view2',
        templateUrl: 'view2/view2.html',
        controller: 'View2Ctrl'
    });       
});

控制器

'use strict';

angular.module('myApp.view1', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/view1', {
        templateUrl: 'view1/view1.html',
        controller: 'View1Ctrl'
    });
}])
.controller('View1Ctrl', ['$scope','itemsService',function($scope,itemsService, $uiModal) {

    $scope.$on('itemSwitch.moreInfo', function(event, obj){
        $scope.openModal(obj);
    });

    $scope.openModal = function (obj) {

        var modalInstance = $uiModal.open({
            animation: $scope.animationsEnabled,
            templateUrl: 'templates/modalTemplate.html',
            controller: 'View1Ctrl',
            resolve: {
                items: function () {
                    return obj;
                }
            }
        });
    }
}]); //END

任何人都可以点我正确的方向来解决这个问题吗?

谢谢你


错误了,但现在它不显示灰色出屏幕,除了控制台显示modal html 是加载但显示不正确。

enter image description here

解决方法 1:

你注射签名不是正确的。你是缺少 $uiModal 。观察以下......

.controller('View1Ctrl', ['$scope', 'itemsService', 
    function($scope, itemsService, $uiModal) {

=>

.controller('View1Ctrl', ['$scope', 'itemsService', '$uiModal', 
    function($scope, itemsService, $uiModal) {

不完全确信你有意注入服务的确切名称。我猜这里基于您定义的变量名为 $uiModal ,不过,我注意到它是文档状态 $uibModal 。你需要对此进行验证。


在回应你更新的新发现的问题,我最好的观察是, templateUrl: ''<script id=""> 必须匹配。试着改变你 <script> 于以下内容的标记...

<script type="text/ng-template" id="templates/modalTemplate.html">
    <!-- <div> -->

我偶然发现这同时玩,发现文档中的默认呆瓜。如果两个值都不相同是错误的。

赞助商