Why does adding an ng-repeat to my AngularJS templ

2019-09-19 19:04发布

问题:

I have an AngularJS directive whose template file looks like this:

path/to/myDirectiveA.template.html:

<tr>
    <td bgcolor='#7cfc00'>Statement</td>
    <td bgcolor='#ff1493'>{{MyDirectiveACtrl.a.b}}</td>
</tr>

It works. The output looks like this:

But then I change the template file by adding an ng-repeat like this:

<tr ng-repeat="currRow in [0, 1, 2, 3]">
    <td bgcolor='#7cfc00'>Statement</td>
    <td bgcolor='#ff1493'>{{MyDirectiveACtrl.a.b}}</td>
    <td bgcolor='#7cfc00'>{{currRow}}</td>
</tr>

And that causes it to break as you can see in the image below. The phrase Hello World! is no longer showing up! Why? How can I fix this problem??

I simply don't see any logical reason why adding an ng-repeat should cause this breakage. It doesn't make sense to me at all.

If you need it, here is the controller and directive that invoke it can be found in this question I posted earlier.

回答1:

<tbody>
<tr ng-repeat="currRow in [0, 1, 2, 3]">
<td bgcolor='#7cfc00'>Statement</td>
<td bgcolor='#7cfc00'>MyDirectiveACtrl.a.b</td>
<td bgcolor='#ff1493'>{{MyDirectiveACtrl.a.b}}</td>
<td bgcolor='#7cfc00'>{{currRow}}</td>
</tr>
</tbody>

update your myDirectiveA.template.html .Hope it helps you :)



回答2:

may this solve the problem ($parent)

<tr ng-repeat="currRow in [0, 1, 2, 3]">
    <td bgcolor='#7cfc00'>Statement</td>
    <td bgcolor='#ff1493'>{{$parent.a.b}}</td>
    <td bgcolor='#7cfc00'>{{currRow}}</td>
</tr>