角度共享/发送验证数据之间的视图答案

【问题标题】：angular sharing/sending validation data betvien views角度共享/发送验证数据之间的视图
【发布时间】：2013-10-18 15:18:07
【问题描述】：

我正在尝试使用 routeProvider ng-view 和 2 个控制器制作 2tabs 应用程序。第一个选项卡将是用户表单。在第二个选项卡上，我想向用户显示他输入的验证消息。

路由

project.config(["$routeProvider",function($routeProvider)
    {
    $routeProvider.
        when('/', {controller:'Ctrl1', templateUrl:'tab_1.html'}).
        when('/tab1', {controller:'Ctrl1', templateUrl:'tab_1.html'}).
        when('/tab2', {controller: 'Ctrl2', templateUrl:'tab_2.html'}).

我使用工厂存储数据

project.factory('userService', function(){
    return{valids: {}}
})

并在我的 2 个控制器上调用它

project.controller('Ctrl1', ['$scope', '$rootScope', 'userService', function(scope, rootScope, userService){
scope.data=userService;

并在控制器 html 模板上分配变量

ng-model="data.input1"

加载页面（tab1）后，我可以访问我输入的 $dirty 和 $invalid 值。

scope.form.input.$invalid;

但是当用户切换到 tab2 时，我理解 controller1 刷新，我现在只保存工厂数据和一些使用 $on('$routeChangeStart' 函数手动发送的变量

问题是 - 存储/发送/共享这些 $dirty 和无效变量以在第二个控制器中访问它们的最佳和正确方法是什么？如何以角度方式做到这一点？

Mb 我需要像这样将它们添加到工厂数据中

scope.data.valids.input_invalid = scope.form.input.$invalid;
scope.data.valids2.input_invalid = scope.form.input2.$invalid;

或者添加一些控制器（工厂/指令？）？

或者在controller2/2范围内手动编写验证函数（控制器/工厂/指令？）？

【问题讨论】：

您是否考虑过编写一个服务来存储两个控制器都可以引用的用户输入/验证？
我用它来存储数据：project.factory('userService', function(){ return{valids: {}} }) 它的服务对吗？我将输入绑定到此服务变量...但是如何处理 scope.form.input2.$invalid 和 scope.form.input2.$dirty？
您应该注意视图控制器上的表单验证。当服务令人满意时，应该“承诺”服务。您不希望无效数据出现在您的第二个标签中，除非我混淆了您在此处尝试实现的目标。

标签： angularjs

【解决方案1】：

曼尼 D 是对的。解决问题的最佳方法是创建一个服务来存储输入，并将其注入每个控制器。看起来您可以为此调整 userService。

在处理输入的控制器中，您可以 $watch 表单，并在服务上调用 setIsValid(scope.form.input.name, scope.form.input.$valid) 方法来存储表单的状态它改变。将每个输入的有效性存储在服务中的对象上。

在另一个控制器中，您可以在作用域上添加对此服务的引用，然后将数据绑定到输入有效性对象的属性以在您的 UI 中显示它们。

【讨论】：