使用组件和模板角度 1.6 时不会触发 ng-click 和 ng-change

Question

我正在尝试在输入中键入某些内容时触发一个函数。由于某种原因，当我使用模板和组件时，它不起作用。谁能帮我弄清楚为什么会发生这种情况？顺便说一下，我是 Angular 的新手。

组件当单击按钮或在输入中键入某些内容时，ng-单击和 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>

Answer 1

如果你看一下你的controllerAs语句，你会把它拼写为controllarAs。这可以解释为什么当您使用coin时模板中没有任何内容在侦听。