我想在我的应用程序中创建一个ionicModal表单,但它总是说:
TypeError: undefined is not a function
at new AppController (http://127.0.0.1:58710/www/js/home/AppController.js:15:17)
at invoke (http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:11591:17)
at Object.instantiate (http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:11602:23)
at http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:14906:28
at http://127.0.0.1:58710/www/lib/ionic/js/angular-ui/angular-ui-router.js:2797:28
at nodeLinkFn (http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:14336:13)
at compositeLinkFn (http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:13730:13)
at publicLinkFn (http://127.0.0.1:58710/www/lib/ionic/js/ionic.bundle.js:13626:30)
at updateView (http://127.0.0.1:58710/www/lib/ionic/js/angular-ui/angular-ui-router.js:2733:23)
at http://127.0.0.1:58710/www/lib/ionic/js/angular-ui/angular-ui-router.js:2697:11 <div ui-view="">
我的代码是:
function AppController($scope, $log, $state, $ionicModal) {
'use strict';
$scope.days = [];
var column = [];
// Load the modal from the given template URL
console.log(JSON.stringify($ionicModal) + "lalala");
$ionicModal.fromTemplateUrl('templates/home/selectedDay.html', function ($ionicModal) {
$scope.modal = $ionicModal;
$scope.modalRightButtons = [
{
type: 'button-clear',
content: 'Close',
tap: function (e) {
$scope.modal.hide();
}
}];
}, {
// Use our scope for the scope of the modal to keep it simple
scope: $scope,
// The animation we want to use for the modal entrance
animation: 'slide-in-up'
});
$scope.openModal = function () {
$scope.modal.show();
};
这与示例中的完全相同我只是不知道我做错了什么... 我的app.js是:
var App = angular.module('App', ['ionic', 'ngResource', 'ui.router']);
App.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home', {
url: '/home',
views: {
'Header': {
templateUrl: 'templates/home/homeHeader.html',
controller: 'homeHeaderController'
},
'': {
templateUrl: 'templates/home/calendar.html',
controller: 'AppController'
}
}
})
$urlRouterProvider
.otherwise('/home');
});
App.run(function ($ionicPlatform) {
$ionicPlatform.ready(function () {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
});
});
App
.controller('AppController', ['$scope', '$log', '$state', '$localstorage', AppController])
我有一个其他应用程序,一切正常。我不明白这里有什么不对......
修改
我更改了AppController的第一行,现在我收到了另一个错误。
新的第一行:
function AppController($scope, $log, $state, Api, $localstorage, $ionicSideMenuDelegate, $ionicPopup, $ionicModal) {
新错误:
“无法读取来自未定义的'templateUrl'的属性”
答案 0 :(得分:3)
问题在于依赖注入(DI)。如果您计划缩小代码,则使用的语法很好,但您必须在两个位置以完全相同的顺序声明完全相同的依赖项。您的AppController对象具有比在angular.controller()方法中声明的更多依赖性。
控制器功能
function AppController ($scope, $log, $state, Api, $localstorage, $ionicSideMenuDelegate, $ionicPopup, $ionicModal) {
...
}
角度控制器声明
App.controller('AppController', ['$scope', '$log', '$state', 'Api', '$localstorage', '$ionicSideMenuDelegate', '$ionicPopup', '$ionicModal', AppController]);