Aurelia.js按下按鈕時更改文本值

單擊此按鈕時可以更改按鈕顏色，但如何在單擊時更改文本？Aurelia.js按下按鈕時更改文本值

改變文本從點擊到點擊

的Html：

<button type="button" class="btn ${clicked ? 'btn-danger' : 'btn-primary'}" click.trigger="handleClick()">Click</button>

JS ...

clicked = false; 

    handleClick(){ 
    this.clicked = !this.clicked; // toggle clicked true/false 
    return true; // only needed if you want to cancel preventDefault() 
    }

來源

2017-05-08 Raduken

我會嘗試在S AME在你與類做的按鈕上的文字：

<button type="button" class="btn ${clicked ? 'btn-danger' : 'btn-primary'}" click.trigger="handleClick()"> 
    ${clicked ? 'Clicked' : 'Click'} 
</button>

要麼，或設置按鈕文本的變量，並在功能改變它。

來源

2017-05-08 08:55:27 Josh

您可以使用ref屬性訪問元素。另外建議儘可能使用.delegate而不是.trigger。查看更多信息here。

下面是一個例子：https://gist.run?id=99524bb7fee9d0b7272741477c1fffb8

app.html

<template> 
    <button ref="btn" click.delegate="onClick(btn)">Click Me!</button> 
</template>

app.js

export class App { 
    message = 'Hello World!'; 
    onClick(button) { 
    button.innerText = 'Clicked!' 
    } 
}

的index.html

<!doctype html> 
<html> 
    <head> 
    <title>Aurelia</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    </head> 
    <body aurelia-app> 
    <h1>Loading...</h1> 

    <script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/config.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script> 
    <script> 
     require(['aurelia-bootstrapper']); 
    </script> 
    </body> 
</html>

來源

2017-05-08 08:58:57 janmvtrinidad

Aurelia.js按下按鈕時更改文本值

回答

相關問題