Javascript 为什么AngularJS视图没有';导航时不会改变吗?
我是新来安格拉斯的。我写了一些导航代码,工作非常完美。但当我集成到angularJs服务中时,它就停止工作了。它会更改浏览器URL,但视图不会更新。如果我将MetroPreLoader从我的服务中删除,那么它将再次工作 这是我的密码: 服务:Javascript 为什么AngularJS视图没有';导航时不会改变吗?,javascript,html,css,angularjs,angularjs-directive,Javascript,Html,Css,Angularjs,Angularjs Directive,我是新来安格拉斯的。我写了一些导航代码,工作非常完美。但当我集成到angularJs服务中时,它就停止工作了。它会更改浏览器URL,但视图不会更新。如果我将MetroPreLoader从我的服务中删除,那么它将再次工作 这是我的密码: 服务: voiceAppControllers.factory('appService', function ($http, $log, $window) { return { showWaitBar : function() {
voiceAppControllers.factory('appService', function ($http, $log, $window) {
return {
showWaitBar : function() {
MetroPreLoader.setup({
logoUrl: "Content/Images/logo.png",
logoWidth: "100px",
logoHeight: "100px",
multipleBGColors: ["#CA3D3D", "#F58A16", "#32A237", "#A110E6"],
delay: "Unlimited"
});
MetroPreLoader.run();
},
hideWaitbar : function() {
MetroPreLoader.close();
}
};
})
控制器:
voiceAppControllers.controller('loginController', ['$scope', '$http', '$location', '$timeout', 'appService', 'notificationService',
function ($scope, $http, $location,$timeout, appService, notificationService) {
var onSuccess = function () {
notificationService.pushNotifaction("service update successfully.");
};
var onError = function () {
notificationService.pushNotifaction("service update fail.");
};
$scope.login = function () {
var credentials = "grant_type=password&username=" + $scope.loginModel.Username + "&password=" + $scope.loginModel.Password;
console.log(credentials);
appService.showWaitBar();
$http({
method: 'POST',
url: appService.loginUrl,
data: credentials,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
.success(function (data) {
console.log(data.access_token);
appService.updateAuthInfo(data.userName, data.access_token);
appService.hideWaitbar();
$location.path(appService.routes.dahboard);
})
.error(function () {
appService.clearAuthInfo();
appService.hideWaitbar();
$location.path(appService.routes.login);
notificationService.pushNotifaction("Login Fail. Wrong username and password.");
});
};
}
]);
当我对appService.showWaitBar()和appService.hideWaitbar()进行注释时,它就可以正常工作了
我大胆地错过了一些东西,但我不知道它是什么
蒂纳克斯
更新1:
我的App.js是:
var voiceAppControllers = angular.module('voiceAppControllers', []);
var voiceApp = angular.module('voiceApp', ['ngRoute', 'voiceAppControllers', 'kendo.directives']);
voiceApp.config(['$routeProvider',
function ($routeProvider) {
$routeProvider.
when('/organization', {
templateUrl: 'Templates/OrganizationTemplate.html',
controller: 'organizationController'
}).when('/service', {
templateUrl: 'Templates/ServiceTemplate.html',
controller: 'serviceController'
}).when('/login', {
templateUrl: 'Templates/LoginTemplate.html',
controller: 'serviceController'
}).when('/Dashboard', {
templateUrl: 'Templates/DashboardTemplate.html',
controller: 'dashboardController'
}).
otherwise({
redirectTo: '/login'
});
}]);
登录视图为:
<div ng-controller="loginController">
<form name="loginFrom" novalidate ng-submit="login(loginFrom)">
<input type="hidden" ng-model="loginModel.Id" />
<h1>Login</h1>
<label>Need Some Text</label>
<div>
<label>username :</label>
<div class="input-control text">
<input type="text" placeholder="Your username" required ng-model="loginModel.Username" />
</div>
</div>
<div>
<label>password :</label>
<div class="input-control password">
<input type="password" placeholder="Your password" required ng-model="loginModel.Password" />
</div>
</div>
<div class="offset3">
<input class="primary" type="submit" value="UPDATE" ng-disabled="loginFrom.$invalid" />
</div>
</form>
</div>
登录
需要一些文本吗
用户名:
密码:
我的仪表板视图是:
<div ng-controller="dashboardController">
<h1>Dashboard</h1>
<input type="button" value="Next" />
</div>
仪表板
我必须承认我不是很有经验,看到更多的代码可能会让我受益,但我怀疑一个错误是“dashboard”的拼写不正确:“appService.routes.dahboard”您是否尝试过在$location.path之后添加$scope.$apply()?@AlexChoroshin不幸的是,我在这里没有看到任何与$scope相关的模板,所以我不知道$scope.$apply是否会有所不同。如果您还没有使用它,请让Batarang Chrome extension分阶段帮助调试。没有JS控制台错误?@ChrisBell没有JS控制台错误,没有更新视图,一切正常。