Question

我创建了一个div，目前当我点击它时，它的颜色从绿色变为红色。我想添加一个按钮，单击哪个颜色选择器出现，我选择的颜色成为它的背景。

以下是我目前的

代码

home.html的

        <div class="stileone">
            Div Content
        </div>

//I want code on this button click to select color from color picker and selected color shall become the div's background color
    <button ion-button (click)="select_color()">Select Color</button>

home.ts

ngOnInit(){
$(".stileone").on("click", function() {
        $(this).css("background", "red");
    }); 
}

home.scss

.stileone {
    background: green
}

请注意我在上面的代码中使用js，我很好，我可以使用Ionic或JS，两者都可以。对于HTML操作，我使用DOM清理程序，所以我可以使用JS或jQuery。

Answer 1

我认为你所需要的只是：

组件方：

color = 'transparent';

select_color(){
    this.color = this.getRandomColor();
}

模板面：

<div class="stileone"  [ngStyle]="{'background-color': color}">
    Div Content
</div>

<强> WORKING DEMO

使用颜色选择器更改div的背景颜色

1 个答案: