你用angular嗎？
一.介紹
如何只改動最簡單的css**，呈現完全不一樣的檢視效果。
第一種：最基本的設定：
圖1 **
圖2 介面執行效果圖
平常，想給乙個label或者p等標籤新增樣式，我們就是這樣操作，在angular中也是一樣的。
現在，如果我想要將字型換成紅色呢，首先想到的就是去修改.label裡的color屬性值，可如果樣式表是封裝的或者外部引用的，不方便修改呢？
這時候就要用到elementref 和renderer2了。可以去angular 官網裡搜尋喲。
renderer.class 圖
我們可以這樣用：
當然elementref和renderer2都引用自@angular/core庫裡面的。 至於viewchild 和ngafterviewinit()可以自行去了解。
修改效果圖
當然，你說這樣修改的弊端有沒有呢？肯定是有的，因為，this.el.nativeelement獲取的是當前元素，如果用*ngfor生成了一系列的label的話，它只會給你修改第乙個label的。那有沒有其他的辦法可以修改呢。當然也是有的！
我們可以獲取到元素的節點進行操作?
label.ts
獲取元素節點，還是用上面的elementref。 如果要改變所有的，for迴圈皆可以啦。
可是，這樣做又有問題了？如果想不同的label不同字型顏色怎麼辦呢？
當然angular也提供了方法呀？ ngstyle和ngclass可以用呀！
[ngstyle]="" 和[style.color]是一樣的意思。
你的label想變成什麼顏色，你就給我傳那個值進來，0就是green......
這種適用於只需要修改少量屬性的標籤。
如果你需要修改顏色，字型大小，間距....這種方式顯然太繁瑣，這時候ngclass就來了。
注意ngclass後面的字樣。label為什麼沒有用單引號呢，而後面的text-primary卻有呢？
1.label是乙個變數，我們的樣式是可以傳參的。
也就是你的html標籤不需要改動，需要什麼樣式就在ts離傳入即可。ngclass也可以利用這個特性去修改。
其實這幾種用的地方也挺多的，不過得根據實際需求去採用不同形式。
歡迎來找我交流angular 或前端技術喲。
Angular4基本功 元件繫結
最近專案上用到了angular4進行開發前台，組織了零散的知識分享給大家根據需求改變屬性,根據 可以看出，只要star是true則我們現實我們的樣式，如果為false則不顯示，很好的做到了動態的效果 class.glyphicon star empty star div tsprivate star...
angular4如何安裝建立專案 元件
一 安裝最新版本的nodejs 首先在控制台用node v 和npm v來看一上當前的版本。老版本會出現錯誤。二 全域性安裝angular cli 腳手架工具 1.使用npm命令安裝 npm install g angular cli2.npm可能會安裝失敗，可以切換到 映象 npm install...
angular4學習記錄 元件通訊 生命週期
父元件通過屬性繫結到子元件，子元件通過事件傳遞引數到父元件 父元件通過區域性變數獲取子元件的引用 父元件使用 viewchild獲取子元件的引用 兩個不相關聯的元件使用中間人模式互動 終極大招 建立乙個服務注入到元件中 直接把父元件當做服務注入到子元件中 輸入輸出屬性必須是在有父子關係的元件間使用 ...