0

当输入输入内容时，我试图触发一个函数。出于某种原因，当我使用模板和组件时它不起作用。谁能帮我弄清楚为什么会这样？顺便说一句，我是 Angular 的新手。

组件 当单击按钮或在输入中键入内容时，应该触发 ng-click 和 ng-change 函数，但它们不会。

(function(angular) {
  'use strict';
  angular
    .module('app')
    .component('coinSearch', {
      controller: CoinSearchController,
      controllarAs: 'coin',
      templateUrl: 'src/coinSearch.html'
    });


  function CoinSearchController(CryptoService) {
    var coin = this;
    var list = [];
    coin.jank="something weird";
    coin.savedCoins = [];
    coin.searchedCoin = '';

  function getCrypto() {                      //pulls data from API
      CryptoService
        .retrieve()
        .then(function(response) {
            coin.list = response;
        });
    }

    coin.click = function() {
      console.log('HELLOOO');
    };

    coin.showSearch = function() {
      console.log('hello');               
      return coin.searchedCoin === '';
    };
      getCrypto();
  }
})(angular);

上面组件的模板 模板。有一些 console.logs 用于测试目的。

<div class="container">
   <form class="search-form">
    <button ng-click="coin.click()">{{coin.jank}} </button> //testing

    <input
      type="text"
      class="search"
      placeholder="Search Crypto"
      ng-model="coin.searchedCoin"
      ng-change="coin.showSearch()">





    <ul class="suggestions">
        <li ng-hide="coin.showSearch()" ng-repeat="coins in coin.list | 
filter:coin.searchedCoin">
            <span>{{coins.name}} ({{coins.symbol}})</span>
            <span>${{coins.price_usd}}</span>
            <span><button ng-
click="coin.addToList(coins);">Add</button></span>
            </li>
        </ul>
    </form>
    <coin-list></coin-list>
</div>
4

1 回答 1

1

如果你看你的controllerAs陈述，你把它拼写为controllarAs。这可以解释为什么当您使用coin.

于 2017-07-28T21:02:28.180 回答