私はこのコンポーネントを持ってAngularJSコンポーネント

Question

のボタン/機能を提出してください：メインページのコントローラ

const rtmNav = { 
    bindings: { 
     from:'<', 
     to:'<', 
     submit: '&' 
    }, 
    controller: angular.noop, 
    templateUrl: require('./rtmNav.html') 
} 

export default rtmNav; 

：

<div class="rtm-nav"> 
    <div ng-app>  
    <form ng-submit="$ctrl.submit"> 
     <label>From: 
      <input type="text" name="input" ng-model="$ctrl.from"> 
     </label> 
     <label>To: 
      <input type="text" name="input" ng-model="$ctrl.to"> 
     </label> 
     <input type="submit" id="submit" value="Apply" /> 
    </form> 
    </div> 
</div> 

それは、コントローラの

class DemandCtrl { 
    constructor(ChartDataService) { 
     this.ChartDataService = ChartDataService; 
     debugger; 
     this.dataa = { 
      from: '10/01/2017', 
      to: '10/03/2017' 
     }; 
     this.submit =() => { 
      console.log('tesst'); 
     }; 
    } 

    $onInit() { 
     getData.call(null, this);  
    } 
} 

function getData(DemandCtrl) { 
    debugger; 
    DemandCtrl.ChartDataService.getData(DemandCtrl.dataa).then(result => { 
     DemandCtrl.result = result.data; 
     getChart(result.data); 
    }).catch((e) => { 
     console.log(e); 
    }); 
} 

... 

DemandCtrl.$inject = ['ChartDataService']; 

export const Demand = { 
    bindings: { 
     data: '<' 
    }, 
    templateUrl: demandPageHtml, 
    controller: DemandCtrl 
}; 

そしてここにはありますメインページのHTML：

<div class="demand page"> 
    <rtm-header title="Demand" icon="fa fa-line-chart" link=true></rtm-header> 
    <rtm-nav from="$ctrl.dataa.from", to="$ctrl.dataa.to", submit="console.log('xxx')">   
    </rtm-nav> 
    <div id="chart" class="demand-chart"> 
    </div> 
</div> 

dataa.fromとdataa.toのテキスト入力に、紹介したハードコードされたデータ（10/01/2017と10/03/2017）が入力されています。

問題は[適用/送信]ボタンにあります。私はそれをクリックすると、コンソールにメッセージ（xxx）が表示されることを期待していますが、何も起こりません。

は、今では submit="console.log('xxx')"として書かれているが、私は次のようなエラーが生じ function{submit="console.log('xxx')};"としても試してみた：

standalone.js:16 Error: [$parse:syntax] Syntax Error: Token '{' is an unexpected token at column 9 of the expression [function{console.log('xxx')] starting at [{console.log('xxx')].

任意のアイデアはどのようにこの問題を解決するために？

あなたは、テンプレート内 console.log()のような関数を使用してコントローラに何かを宣言し、それを呼び出すことはできません

Answer 1

：

代わりの

<rtm-nav from="$ctrl.dataa.from", to="$ctrl.dataa.to", submit="console.log('xxx')"> 

は

<rtm-nav from="$ctrl.dataa.from", to="$ctrl.dataa.to", submit="$ctrl.logSomething()"> 

を行うと、コントローラ内部でそれを宣言（ビューの）：

class DemandCtrl { 
    constructor(ChartDataService) { 
     this.ChartDataService = ChartDataService; 
     debugger; 
     this.dataa = { 
      from: '10/01/2017', 
      to: '10/03/2017' 
     }; 
     this.submit =() => { 
      console.log('tesst'); 
     }; 
    } 

    $onInit() { 
     getData.call(null, this);  
    } 

    logSomething() { 
     console.log('www'); 
    } 
}