angular 1简单路由 - 数据绑定不起作用
angular 1简单路由 - 数据绑定不起作用
我正在使用Angular 1将表单中的数据绑定到下一个视图,使用路由模块来显示来自不同文件的HTML结构。当所有HTML代码都在一个文件中时,原型工作得很完美,但是当我使用路由模块时,数据不会通过链接进行绑定。
在下面的链接中,我只使用CSS进行过渡效果,所以所有的HTML都在一个文件中,而不使用路由模块,那里可以正常工作 http://jspmultimedia.com/angular-cv-css/#form
而在下一个链接中,使用了路由模块,无法将表单中的数据传递到下一个视图中显示。
http://jspmultimedia.com/angular-cv-route/#!/form
var app = angular.module("myApp", ["ngRoute"]); //用于显示和URL的路由 app.config(function($routeProvider) { $routeProvider .when("/", { controller : 'myCtrl', templateUrl : 'dashboard.htm' }) .when("/form", { controller : 'myCtrl', templateUrl : 'form.htm' }) .when("/result", { controller : 'myCtrl', templateUrl : 'resultdashboard.htm' }) .otherwise({ redirectTo: 'dashboard.htm'}); }); //选择列表的作用域(职位) app.controller('myCtrl', function($scope) { $scope.position = [ "前端Web开发人员", "后端Web开发人员", "UI / UE设计师" ] //添加技能 $scope.skills = []; $scope.addItem = function () { $scope.skills.push($scope.addMe); } //删除技能 $scope.removeItem = function (x) { $scope.skills.splice(x, 1); } });
这是form.htm的内容
最后是resultdashboard.htm的内容
{{ name + " " +lastName}}
{{shortDescription}} 申请职位:{{selectedPosition}}
主要技能
- {{x}}
我想我可能在控制器方面漏掉了什么,如果有人能快速查看一下,请告诉我,我会非常感激。这个原型应该是一个用于学习如何使用Angular 1的简历上传,然后再使用其他库,我认为理解路由是我迈出的一大步。无论如何,谢谢。