2014-02-28 76 views
0

问题空间angularjs - 基于脏范围

我其中我提交基于条件的形式来实现,而不是具有表单提交按钮的问题简化形式(自动)的提交。

比方说,我有3个下拉菜单,前两个分组,但需要选择一个,这意味着我可以选择一个或另一个,但我不能让它们为空,第三个是必填字段。

之后,页面自动提取结果。

可以说我有复选框和一些更多的下拉菜单。将来提及的3个下拉列表,复选框和下拉列表中的任何选项都会自动过滤结果。

我所知道的

现在读取角文档后,我在$检查了脏,$质朴和操作上都一样,$使用setDirty和$ setPristine;然而,这似乎是一个FormController

所以我假设这是有用的整个范围。我没有看到我可以找出选定范围的倾向。

我至今

所以基本上,我希望我可以利用的范围的跟踪功能,但我不很了解。我为我的应用程序和单个范围创建了一个控制器,因为这对我来说似乎最简单。我有第三方插件,发挥作用到像范围:

$ scope.3rdpartyConfig = { PROP1:[], PROP2:的getData() }

我不认为这样的事情如果我要检查表单的$ dirty状态,在检查表单提交时会很有用。

于是我想到了我以前做的事情的旧方式,但“angularlizing”吧:

所以我有这样的:

<input type="checkbox" ng-model="state.Checked" ng-change="checkIfWeCanSubmitThenSubmit()" id="ng-change-example1" /> 

所以我会NG-有变化和NG-点击都在我的HTML表单,创下该函数,函数应该是这样的伪代码:

$scope.checkIfWeCanSubmitThenSubmit= function() { 
    var validated = false; 
    //check to see if dropdown1 or dropdown2 are selected 
    //check to see if dropdown3 is selected 
    // add more here per requirement 

    //if the above are true, then validated = true 

    if (validated) 
    { 
     //add dropdown4 and 5, and checkbox groups into filter 
    } 

    submit(); 
} 

但我在想这是不是因为这个特定的做事方式角不便利。

我希望范围能够提供某种方式,在这里我可以检查我的作用域的哪些部分是脏的或不可以提交和获取数据,或者如果有更好的方法比追加这个函数给每个html元素;比如有一些我可以查看并观看的范围跟踪器。

这提醒了我,我不想拥有一系列的$ scope。$ watch要么只是它会太多的工作来绑定到每一块html代码,除非有办法看一个特定范围变量的集合的范围,那么,我不介意。

像(原谅伪代码):

$scope.$watch('dropdown1, dropdown2, dropdown4', function(dirty, pristine) 
{ 
    if (dirty) 
    { blah blah blah } 
}); 

编辑(2013年2月28日):

我试图做这样说:

$scope.masterCriteria = 
[ 
    { DropDown1: $scope.AppModel.Dropdown1}, 
    { DropDown2: $scope.AppModel.Dropdown2 }, 
    { DropDown3: $scope.AppModel.Dropdown3 }, 
    { Checkbox1: $scope.AppModel.Checkbox1 }, 
    { Checkbox2: $scope.AppModel.Checkbox2 } 
]; 

$scope.$watch('masterCriteria', function (newVal) { 
    if (newVal) { logger.info("did I change?"); } 
}, true); 

检测到的守望者什么都没有,并且我更改为AppModel的范围的任何值都没有在$ watch中找到。值得一试,仍然试图弄清楚这一点。

回答

0

您可以稍微更改与输入表单相关的模型和组字段。将它们放入单个对象中。就像这样:

$scope.state = { checkbox1: false, checkbox2: true, ... } 

后来绑定的输入框中的state对象的领域:

<input ng-model="state.checkbox1" ... > 

,观state对象捕捉嵌套字段的所有更新:

$scope.$watch('state', ... 

JsFiddle example here

+0

有趣的是,你也建议我制作另一个范围变量le ts say .. readyToSubmit,并让该变量检查其他范围变量的数据?然后在readyToSubmit上放一个手表?这听起来很有趣。这实际上对我来说似乎是一种代理模式。 – sksallaj

+0

我会实现它,看看它是如何工作的。谢谢。 – sksallaj