Я пытаюсь связать свойство цвета из моего класса (приобретенного привязкой атрибута), чтобы установить фоновый цвет моего div.
import {Component, Template} from 'angular2/angular2';
@Component({
selector: 'circle',
bind:{
"color":"color"
}
})
@Template({
url: System.baseURL + "/components/circle/template.html",
})
export class Circle {
constructor(){
}
changeBackground():string{
return "background-color:" + this.color + ";";
}
}
Мой шаблон:
<style>
.circle{
width:50px;
height: 50px;
background-color: lightgreen;
border-radius: 25px;
}
</style>
<div class="circle" [style]="changeBackground()">
<content></content>
</div>
Использование этого компонента:
<circle color="teal"></circle>
Мое связывание не работает, но не исключает никаких исключений. Если бы я положил {{changeBackground()}} где-нибудь в шаблоне, это вернет правильную строку. Итак, почему привязка стиля не работает?
И подумайте об этом, как бы я посмотрел изменения свойств цвета внутри класса Circle? Что такое замена для
$scope.$watch("color", function(a,b,){});
в angular 2.0?