Question

我理解这可能是一个非常天真的问题，但到目前为止我还没有在网上找到明确的答案。

问题是如何在视图中对控制器中的更改做出反应？

例如，我编写了一个使用服务来执行请求的登录控制器，应该让用户进入或通知他/她登录尝试是否失败：

 var loginFormControllerFunction = function($scope, $log, $location, authenticationService){
    $scope.errorMessage = "";

    $scope.submit = function() {
        $scope.errorMessage = "";
        $scope.loginSuccessful = false;
        authenticationService.authenticate($scope.credentials.userName, $scope.credentials.password).then(
            function(user) {
                var token = user.token;
                //TODO: Receive token. Keep this guy logged for sometime.
                $scope.loginSuccessful = true;
                //TODO 2: Navigate to the main page.
            },
            function(errorMessage) {
                $scope.errorMessage = errorMessage;
                //TODO 3: remove zis from here!!!!
                //alert (errorMessage);
            }
        );
    };
};

基于我如何理解关注点分离和mv *模式的概念，在此阶段控制器不应该：

直接从页面执行任何导航（在TODO 2行）
通过弹出通知等以任何方式与UI交互（TODO 3）。

在我的理解中，它应该提出相应的事件（？）/以某种方式通知谁关心登录操作的结果。然后视图应该导航

如果登录尝试成功，则返回主页
或显示弹出窗口

我错过了什么？使用angularjs实现这一目标的最佳方法是什么？

感谢。

Answer 1

对于第1部分，我将改为在authenticationService中重定向。或者，如果您希望从视图中获得更多控制权，请在调用submit方法时将url作为参数发送。视图本身不能（轻松）重定向您，需要通过调用$ location.path（myPath）在服务或控制器中完成。

你是正确的，控制器不应该直接与视图交互，例如Backbone或类似应用程序（即使用jQuery修改页面）。 Angular控制器应该做的是更新模型，如果想要对此模型更改做出反应，则由视图决定。请记住，Angular会在模型更改时自动更新视图中的内容，以便您可以使用ng-show或其他指令来显示消息。

因此，在您的控制器中，您可以像在示例中一样更新$ scope.errorMessage，并在您的视图中执行：

<form>
    ...
</form>
<span ng-show="errorMessage">Something went wrong: {{errorMessage}}</span>

现在，视图将在控制器设置后立即显示errorMessage。当然，这里的跨度可以替换为任意对象，如模态弹出窗口或其他东西。

如何在视图中对控制器中的更改做出反应

1 个答案: