Question

我想知道如何使范围变量动态化，或者如何将索引附加到变量名的末尾。我似乎无法弄清楚如何做到这一点。我有以下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”和“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 = { 名称：$ scope.search + field， fieldid：field， date_submitted：Date（） }

对不起，这是漫长的啰嗦。我在这个问题上找到的其他答案都没有结果。

Answer 1

如何将搜索变量声明为数组，以便视图类似于

.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)

};

在ng-model和controller中使范围变量动态化

1 个答案: