在ng模型和控制器中创建一个动态的作用域变量



我想知道如何使范围变量动态,或者如何将索引附加到变量名称的末尾。我似乎不知道该怎么做。我有以下2个搜索框(用Jade写的-随时用HTML回复)

.search-bar.col-xs-5
    input.form-control(
        type='text', 
        ng-model='search1', //how to make this part dynamic?
        ng-change='change()', 
        onclick='select()', 
        placeholder='Enter full movie name', 
        autofocus='')
.col-xs-1
    button#submit1.btn.btn-default(type='button' ng-click="save(1)") 
.search-bar.col-xs-5
    input.form-control(type='text', 
        ng-model='search2', 
        ng-change='change()', 
        onclick='select()', 
        placeholder='Enter full movie name', 
        autofocus='')
.col-xs-1
    button#submit2.btn.btn-default(type='button' ng-click="save(2)") 

可以看到ng-model是"search1"one_answers"search2"。在我的控制器中,我有几个函数对这些字段做出反应。考虑以下内容:

    function fetch() {
        if ($scope.search1) {
        $http.get("http://www.someapi.com/?t=" + $scope.search1)
            .success(function(response) {
                $scope.details1 = response;
            });
        };
        if ($scope.search2) {
        $http.get("http://www.someapi.com/?t=" + $scope.search2)
            .success(function(response) {
                $scope.details2 = response;
            });
        };
    };
    $scope.save = function(field) {
        var title;
        if (field == 1) {
            title = {
                name: $scope.search1,
                creator: "1",
                date_submitted: Date()
            }
        }
        if (field == 2) {
            title= {
                name: $scope.search2,
                creator: "2",
                date_submitted: Date()
            }
        }
        $http.post("/api/posts", title)
    };

肯定有更好的方法来处理这两个函数。如果我有10个搜索字段呢?我不想总是使用if块来确定我在哪个字段或存储什么数据。例如,我想基本上是这样的(显然这不起作用,但它的想法是我想要的):

        $http.get("http://www.someapi.com/?t=" + $scope.search + field)
            .success(function(response) {
                $scope.details1 = response;
            });

title = {名称:美元范围。搜索+字段,fieldid:字段,date_submitted:日期()}

对不起,这是冗长的。我找到的关于这个话题的其他回答都是不确定的。

如何将搜索变量声明为Array,从而使视图类似于

.search-bar.col-xs-5( ng-repeat="s in searches track by $index")
    input.form-control(
        type='text', 
        ng-model='s',
        ng-change='change()', 
        onclick='select()', 
        placeholder='Enter full movie name', 
        autofocus='')
  .col-xs-1
      button#submit1.btn.btn-default(type='button' ng-click="save($index)") 

则控制器将具有以下

$scope.searches = [null, null, null, null] // assuming 4 search criteria
$scope.details = [null, null, null, null]
function fetch() {
  for(s, i in $scope.searches){ // this line is written in coffeescript you can map it to JS
    if (s) {
    $http.get("http://www.someapi.com/?t=" + s)
        .success(function(response) {
            $scope.details[i] = response;
        });
    };
  }
};
$scope.save = function(i) {
    var title = {
            name: $scope.searches[i],
            creator: i+1,
            date_submitted: Date()
        }
    $http.post("/api/posts", title)
};

最新更新