角度2

Question

から選択のすべてのオプションを取得した文書、すなわち内の選択があります：

<select tabindex="1" size="5" name="abc" multiple> 
    <option value>Select a value.</option> 
    <option value>option 1</option> 
    <option value>option 2</option> 
    <option value>option 3</option> 
    <option value>option 4</option> 
</select> 

私はジャバスクリプト/ typescriptですに以下のような何かができる：

let select = document.querySelector("select").children; 
    for(let i= 0; i<select.length; i++) { 
     console.log(select[i].innerHTML); 
    } 

が、同じコードで角度2のクラスは私にこれを与えるでしょう：

<select tabindex="1" size="5" name="abc" multiple> 
    <option value>Select a value.</option> 
    <option value>__</option> 
    <option value></option> 
</select> 

私はそれが文書完全にロードされています。角2のスクリプトなどは一番下にあり、私はそれらを実行しようとしました

window.onload and $(document).ready(...); 

それでも私にはオプションが与えられません。何か案が？

Answer 1

DOMをAngularで直接操作しないでください。

@Directive({ selector: 'option' }) 
export class OptionDirective {} 

xxx.component.ts

@Component({ 
    selector: 'some-selector' 
}) 
export class SomeComponent implements AfterContentInit { 
    @ContentChildren(OptionDirective) options: QueryList<OptionDirective>; 

    ngAfterContentInit() { 
    // do something with list items 
    // loop through all list of option, then do something you want. 
    } 
} 

@ContentChildren

QueryList