Angular:为什么不在同一控制器中的视图之外进行模型更新?

时间:2016-03-10 04:58:48

标签: angularjs angularjs-scope angularjs-view

我发现很多帖子都在谈论模型/视图没有更新,但我仍然无法弄清楚这一点。我是Angular的新手,顺便说一句,所以我怀疑这是noob问题。

我有以下Angular应用程序。

编辑文本输入test_var时,编辑后的值不会在侧栏中更新,而是在视图中。为什么以及如何解决?

当我不使用视图和路径时,这是有效的。

我尝试过侧边栏控制器,但没有区别。我尝试了$rootScope,它部分工作(它打破了其他功能),但我不想使用全局范围。

谢谢你看看。

HTML

<body>

	<div ng-app="rxApp" ng-controller="WizardCtrl">
		
		<div class="ng-view">
		</div>

		<div class="sidebar">
			<span ng-bind="test_var"></span>
		</div>

	</div>

</body>

查看(One.html)

<input ng-model="test_var" />
	
<span ng-bind="test_var"></span>

控制器

rxApp.controller( 'WizardCtrl', function ( $scope, $http, $routeParams, $location, FileUploader ) {

   $scope.test_var = 'please work!';

)};

路线

rxApp.config(['$routeProvider',
	function($routeProvider) {
		$routeProvider.
		when('/one', {
			templateUrl: 'templates/one.html',
			controller: 'WizardCtrl'
		}).
		when('/two', {
			templateUrl: 'templates/two.html',
			controller: 'WizardCtrl'
		}).
		otherwise({
			redirectTo: '/one'
		});
	}
]);

2 个答案:

答案 0 :(得分:1)

控制器在转换路线时处理。 至于最佳实践,您应该创建一个服务来处理该数据。您不应该使用控制器在视图之间传输数据。在您的情况下,问题是控制器在转换路由时处理。

请参阅有关如何正确使用控制器的角度文档。 http://docs.angularjs.org/guide/dev_guide.mvc.understanding_controller

答案 1 :(得分:0)

问题在于制作模型变量。

你必须在模特中有一个点。使模型指向一个对象。

所以在你的控制器中这样做 -

rxApp.controller('WizardCtrl',function($scope, $http, $routeParams,$location, FileUploader){

    $scope.test ={
         var : 'please work!'
       };

)};

查看(One.html)

<input ng-model="test.var" />

<span ng-bind="test.var"></span>

<强> HTML

<body>

    <div ng-app="rxApp" ng-controller="WizardCtrl">

        <div class="ng-view">
        </div>

        <div class="sidebar">
            <span ng-bind="test.var"></span>
        </div>

    </div>

</body>

要详细了解范围,请查看此UnderStanding Scopes