javascript - 如果同一 Controller 在页面中使用两次,则停止反射(reflect)彼此的模型

标签 javascript angularjs

我在我的页面中两次使用 mvc 部分控件来实现搜索功能。 它有自己的 Controller 来搜索,所以我的页面有两个同名的 Controller 。

<div ng-app="app" ng-controller="MainController" ng-init="SetSearchParam()">
     <div id="search1">
        @Html.Partial("_SearchPartial") // say it search1
        // some other code to show search results
        // ....               
        // ..
     </div>
     <div id="search2">
        @Html.Partial("_SearchPartial") // say it search2
        // some other code to show search results
        // ....               
        // ..
     </div>
</div>

这是 _SearchPartial:

<form name="SearchCommon">
    <div ng-model="search" ng-controller="SearchPartialController">
            <div>
                <input type="text" value="" placeholder="Stock" ng-model="search.Stock" />
            </div>

            <div>
                <input type="text" value="" placeholder="Make" ng-model="search.Make" />
            </div>

            <div>
                <input type="text" value="" placeholder="Year" ng-model="search.Year" />
            </div>

            <div>
                <input type="submit" value="SEARCH" ng-click="searchdata(search)" />
            </div>
    </div>
</form>

现在在 MainController 的初始化中,我在 SetSearchParam() 方法中设置了 search 模型值,如下所示:

$scope.SetSearchParam = function(){
   var s = {};
   s.Make = "Test";
   s.Year = "2012";
   s.Stock = "5"

   $scope.search = s; 
};

由于在SearchPartialController中使用了search模型,并且页面有两个搜索控件,s的值将在两个部分 Controller 中设置。此外,当我更改 search1 中的参数时,它会反射(reflect) search2。

我希望那些搜索参数只为搜索 1 设置,而不是为搜索 2 设置。 当我更改 search1 参数时,它不应反射(reflect) search2,反之亦然。

有什么办法可以实现吗?

最佳答案

我觉得你应该在你的函数之前初始化你的过滤器(搜索)。

Controller :

$scope.search1 = { Make : "Test", Year: "2012", Stock : "5" };
$scope.searchdata = function(search){console.log(search);};

您的看法:

<body ng-controller="SearchPartialController">
    <form ng-submit="searchdata(search1)">
        <input type="text" placeholder="Stock" ng-model="search1.Stock" />
        <input type="text" placeholder="Make" ng-model="search1.Make" />
        <input type="text" placeholder="Year" ng-model="search1.Year" />
        <button type="submit" class="btn btn-sm btn-primary">
                    Save
        </button>
    </form >
</body>

关于javascript - 如果同一 Controller 在页面中使用两次,则停止反射(reflect)彼此的模型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33864005/

相关文章:

javascript - 在 Javascript 中,如何将 1.00 表示为 JSON 对象中的数字?

angularjs - 是否可以动态导入模块?

javascript - 如何从 Wijmo Flex 网格 TreeView 中的节点转到父节点

javascript - 动态更改折线图中的标签

JavaScript 从函数内部引用匿名函数

javascript - 如何显示功能组件列表

javascript - 在路由更改时重新加载不受 ngRoute 管理的 Controller

javascript - 如何使图像半透明?

angularjs - <select> 元素的第一个选择在 IE 中不起作用

javascript - Angular 2 测试版即 10 "Potentially unhandled rejection [3] SyntaxError: Expected"