TypeError: невозможно вызвать метод «заменить» неопределенного

Я новичок в angularJS. Я хочу использовать ввод для одного из моих текстовых полей, но когда я его использую, возникает эта ошибка:

TypeError: невозможно вызвать метод «заменить» неопределенного в области видимости. (http://XX.YY.ca/js/lib/ui-bootstrap.js:3426:32) в fnInvoke (http://XX.YY.ca/js/lib/angular.js:10017:21) в ОПЕРАТОРАХ.| (http://XX.YY.ca/js/lib/angular.js:9532:59) в Object.extend.constant [как получено] (http://XX.YY.ca/js/lib/angular.js:9962:14) в Scope.$digest (http://XX.YY.ca/js/lib/angular.js:11800:40) в Scope.$apply (http://XX.YY.ca/js/lib/angular.js:12061:24) в HTMLButtonElement. (http://XX.YY.ca/js/lib/angular.js:17839:21) в HTMLButtonElement.n.event.dispatch (http://code.jquery.com/jquery-1.11.0.min.js:3:8066) в HTMLButtonElement.r.handle (http://code.jquery.com/jquery-1.11.0.min.js:3:4767)

Мой код в основном такой же, как на сайте angular-ui. Вот:

Разметка:

<div class="modal-body">
    <div class="form-group">
        <input type="text" id="customer" autocomplete="off"
               ng-model="nom" tabindex="0"
               typeahead="customer.customerFirstName for customer in getCustomers($viewValue) | filter:$viewValue"
               typeahead-wait-ms="300" typeahead-on-select="setId($item)"
               typeahead-editable="false" class="form-control input-sm" placeholder="Customer" />
    </div>
</div>

Контроллер:

    [...]
    $scope.getCustomers = function (val) {
        return $http.get('/index.php/customers/get_customers_ajax', {
            params: {val: val}
        }).then(function (res) {
            var customers = [];
            angular.forEach(res.data, function (item) {
                customers.push({
                    'customerID': item.customerID,
                    'customerFirstName': item.customerFirstName,
                    'customerLastName': item.customerLastName
                })
            })
            console.log(customers);
            return customers;
        });
    }
    $scope.setID = function ($item) {
        $scope.newOrder.customerID = $item.customerID;
        Console.log($scope.newOrder.customerID);
    }
});

Ответ серверной части:

[
    {"CustomerID":"1","CustomerLastName":"Pan","CustomerFirstName":"Petter"}, 
    {...}
]

Я не знаю, какую дополнительную информацию я могу предоставить, но если есть, спрашивайте, и я опубликую!


person Fortin    schedule 20.03.2014    source источник


Ответы (2)


Я думаю, вы должны изменить эту строку:

typeahead="customer.customerFirstName for customer in getCustomers($viewValue) | filter:$viewValue"

Кажется, что синтаксис должен быть:

typeahead="<name> for <name> in getCustomers($viewValue) | filter:$viewValue"

если <name> в первой позиции не равно <name> во второй позиции, возвращается ошибка.

Попробуйте изменить свой код на:

typeahead="customer for customer in getCustomers($viewValue) | filter:$viewValue"

И в вашем javascript поместите customerFirstName непосредственно в возвращаемый массив.

person Marco Biagi    schedule 28.03.2014

Я думаю, проблема в том, что вы устанавливаете ng-model="nom", но у вас нет переменной $scope.nom, определенной в вашем контроллере. Angular пытается связать клиента, выбранного из typeahead, с переменной nom в вашем контроллере.

person jsparks    schedule 23.03.2014
comment
Я попробовал это, и это все еще не работает. Та же ошибка, что и показана - person Fortin; 25.03.2014
comment
Откуда вы получаете $item? Я не вижу, чтобы это упоминалось в документации Angular как предоставленная переменная. Вместо этого вы можете изменить свой метод setID так, чтобы он имел параметр клиента, и вызывать его из HTML, например: setID(customer)? Попробуйте это и дайте мне знать, если это сработает. Еще одна вещь, которая мне любопытна, что вы могли бы попробовать, это то, что ng-модель должна привязывать выбранное значение к переменной nom в вашем контроллере. В чем я не уверен, так это в том, будет ли он связывать только фамилию или полный объект клиента. Если это клиент, вы можете получить идентификатор от него. - person jsparks; 25.03.2014