ng-content在select標簽Angular2中不起作用

Question

我正在嘗試制作自定義下拉組件，但當我嘗試通過選擇標簽內的ng-content訪問數據時，它無法正常工作。

這是我的自定義組件html文件：

<select class="form-control">

    <ng-content></ng-content>

</select>

這是我調用組件的主要html文件：

<dropdown>
        <option value="">Select details type</option>
        <option value="">Personal</option>
        <option value="">General</option>
        <option value="">Contact</option>
        <option value="">Settings</option>
 </dropdown>

我做錯了什么???

Answer 1

目前angular2使用本機（瀏覽器）HTML解析器。 根據標准，只有<optgroup>和<option>允許在<select>元素內部使用HTML元素（參見此處 ）。 至少Chrome會刪除所有其他HTML標記。 嘗試在Chrome中執行下一個代碼：

var div = document.createElement('div');
div.innerHTML = '<select><ng-content></ng-content></select>';
console.log(div.innerHTML) // "<select><select>"

因此，當angular2開始處理標記時， <ng-content>將被刪除。

在（並且如果） angular2團隊實現其自己的HTML解析器之后，可以解決此問題