Javascript 卡在业力验证作业中（nodejs、angularjs）

我有一个家庭作业，其中需要更改2个文件以通过业力测试。 这两个文件分别是

search\u bar.html

和

controller.js

中的函数。 这样做的目的是让文件通过

听起来很简单，但为了我一生的爱，我不能这么做。我一遍又一遍地阅读作业，我得到的结论如下：

search\u bar.html:

<div class="search-bar-wrapper">
    <input class="search-bar-input" ng-model="searchText" ng-change="update()"/>
</div>

<div ng-repeat="product in productsList" class="autocomplete-result">
    {{product}}
</div>

exports.SearchBarController = function($scope, $http) {
    // TODO: this function should make an HTTP request to
    // `/api/v1/product/text/:searchText` and expose the response's
    // `products` property as `results` to the scope.
    $scope.update = function() {
        $http.
            get('/api/v1/product/text/' + $scope.searchText).
                success(function(data) {
                    $scope.productsList = data;
                }
            );
    };

家庭作业的目标如下：

• 您必须在controllers.js中修改SearchBarController以填写update（）函数，该函数将向 服务器并公开服务器对HTML的响应

• 您必须修改templates/search_bar.HTML中的HTML，以添加一个带有类“search bar input”的输入字段，该类具有双向 数据绑定到searchText变量，并调用update（） 使用ngChange指令的函数。你还需要重复 对于每个搜索结果，具有类“自动完成结果”的div元素

我相信我目前的代码就是这么做的，但显然它是错的。我已经被困在这里很长时间了，我看不出有什么不对

有人能帮忙吗

===============================================================

其他信息：

<div class="search-bar-wrapper">
    <input class="search-bar-input" ng-model="searchText" ng-change="update()"/>
</div>

<div ng-repeat="product in productsList" class="autocomplete-result">
    {{product}}
</div>

exports.SearchBarController = function($scope, $http) {
    // TODO: this function should make an HTTP request to
    // `/api/v1/product/text/:searchText` and expose the response's
    // `products` property as `results` to the scope.
    $scope.update = function() {
        $http.
            get('/api/v1/product/text/' + $scope.searchText).
                success(function(data) {
                    $scope.productsList = data;
                }
            );
    };

如果你很好奇或者想做一天的好事（我希望你能做），这里有关于家庭作业的附加信息，以及与之相关的一些信息：

在本练习中，您将实现MEAN retail的主视图 应用程序，用户访问时将看到的第一个视图 你的网站。该视图包含一个搜索栏，用于搜索 按文本列出产品，即使用/api/v1/product/text/：查询REST API端点

您将主要关注编写通过 test.js文件中指定的mocha测试。你不需要这样做 实际上，在浏览器中运行代码时，您将使用gulp和 运行测试的业力。测试intest.js将为您提供更快的速度 反馈，并将为您提供确切的规格说明 您需要完成此练习

为了运行测试，您应该：

• 在提供的示例代码中运行npm安装
• 使用./node_模块/gulp/bin/gulp手表启动gulp
• 使用./node_modules/karma/bin/karma Start./karma.local.conf.js启动karma
• 您应该查看test.js中的测试，看看AngularJS代码应该做什么
• 修改controllers.js和templates/search_bar.html，如下所述，直到测试通过，karma为您提供以下输出：
  日志：“测试成功！复制/粘贴以下代码以完成此分配：' 日志：“” Chrome43.0.2357（Linux）：成功执行4次（0.21秒/0.126秒）

“向

/api/v1/product/text/test

发出HTTP请求，并向作用域公开结果”

$scope.productsList=数据应该是
$scope.results=数据
（请务必阅读问题，您的指导老师或撰写TODO评论的人告诉您将其命名为
结果
，而不是
产品列表
），当然，您引用的
产品列表
的任何其他地方也应更改为
结果

“以HTML格式显示自动完成结果”
{{product}}
应该是
{{product.name}

“向
/api/v1/product/text/test
发出HTTP请求，并向作用域公开结果”
$scope.productsList=数据应该是
$scope.results=数据
（请务必阅读问题，您的指导老师或撰写TODO评论的人告诉您将其命名为
结果
，而不是
产品列表
），当然，您引用的
产品列表
的任何其他地方也应更改为
结果

“以HTML格式显示自动完成结果”
{{product}}
应该是
{{product.name}
虽然Hankscopio提供的答案引导了我正确的方向，但它并不完整，并留下了一些解释

真正帮助我的一件事（因为我在这方面是新手）是仔细地用业力检查测试本身，具体来说是：

it('makes an HTTP request to `/api/v1/product/text/test` and exposes results to scope', function(done) {
    httpBackend.expectGET('/api/v1/product/text/test').respond({
      products: [{ name: 'test1' }, { name: 'test2' }]
    });

    scope.$on('SearchBarController', function() {
      element.find('input').val('test');
      element.find('input').trigger('input');
      assert.equal(scope.searchText, 'test');

      httpBackend.flush();
      assert.equal(scope.results.length, 2);
      assert.equal(scope.results[0].name, 'test1');
      assert.equal(scope.results[1].name, 'test2');

      ++succeeded;
      done();
    });
  });

在这里我可以看到，实际上我需要一个
范围.results
和
产品.name
变量，并且在控制器中我应该有
数据.products

正如我所怀疑的那样，我很接近，但变量的名称让我很反感。谢谢你的帮助
 虽然天蝎座汉克给了我正确的答案，但答案并不完整，留下了一些解释

真正帮助我的一件事（因为我在这方面是新手）是仔细地用业力检查测试本身，具体来说是：

it('makes an HTTP request to `/api/v1/product/text/test` and exposes results to scope', function(done) {
    httpBackend.expectGET('/api/v1/product/text/test').respond({
      products: [{ name: 'test1' }, { name: 'test2' }]
    });

    scope.$on('SearchBarController', function() {
      element.find('input').val('test');
      element.find('input').trigger('input');
      assert.equal(scope.searchText, 'test');

      httpBackend.flush();
      assert.equal(scope.results.length, 2);
      assert.equal(scope.results[0].name, 'test1');
      assert.equal(scope.results[1].name, 'test2');

      ++succeeded;
      done();
    });
  });

在这里我可以看到，实际上我需要一个
范围.results
和
产品.name
变量，并且在控制器中我应该有
数据.products

正如我所怀疑的那样，我很接近，但变量的名称让我很反感。谢谢你的帮助
 如果你想帮助修复失败的测试，你也应该显示测试：）测试文件有点大，我会找到一种方法尽快发布它！添加了指向test.js文件的链接。如果有人有主意，我洗耳恭听！“但显然它是错的”--你怎么知道？我的代码在一些测试中失败了如果你想帮助修复失败的测试，你还应该显示测试：）测试文件有点大，我会很快找到方法发布它！添加了指向test.js文件的链接。如果有人有主意，我洗耳恭听！“但显然它是错的”——你怎么知道？我的代码在一些测试中失败，但没有雪茄！尽管如此，你的努力还是指引了我。b