0

Angular JSのドキュメントによると、ngRepeat ディレクティブは $index 変数を配列内のアイテム インデックスに設定することになっています。これは Chrome と IE 10 では正常に機能しますが、IE 9 では数字の代わりに「{{$index}}」が表示されます。以下に小さな例を示します。

<!DOCTYPE html> 
<html>
<head>
    <meta charset="utf-8">
    <title>Host Parameters</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
    <style>
        .host-param-table {
            border-collapse: collapse;
        }
        .host-param-table td, .host-param-table th {
            border: 1px solid gray;
            text-align:center;
            padding: 2px;
            font-size: 15px;
            font-family: Arial;
        }
    </style>
</head>
<body id="ng-app" data-ng-app>
<div data-ng-controller="HostParametersCtrl">
    <table class="host-param-table">
        <tr>
            <th>Name</th>
            <th>Index</th>
            <th>On</th>
            <th>Value (Hex)</th>
            <th>Value (Output)</th>
        </tr>
        <tr data-ng-repeat="p in params">
            <td>{{p.name}}</td>
            <td>{{$index}}</td>
            <td><input data-ng-model="p.isEnabled" type="checkbox" /></td>
            <td><input data-ng-model="p.value" data-ng-disabled="!p.isEnabled" type="text" /></td>
            <td>0x{{p.value}}</td>
        </tr>
    </table>
</div>

<script type="text/javascript">
    function HostParametersCtrl($scope) {
        $scope.params = [
            { 'isEnabled': false, 'name': 'First', 'value': '' },
            { 'isEnabled': false, 'name': 'Second', 'value': '' },
            { 'isEnabled': false, 'name': 'Third', 'value': '' },
            { 'isEnabled': false, 'name': 'Fourth', 'value': '' },
            { 'isEnabled': false, 'name': 'Fifth', 'value': '' },
            { 'isEnabled': false, 'name': 'Sixth', 'value': '' },
            { 'isEnabled': false, 'name': 'Seventh', 'value': '' }
        ];

    }
</script>
</body>
</html>

Chrome 29 で表示:

クロム

IE 9 で表示:

インターネット エクスプロイター 9

チェックボックスは、期待どおりに入力を無効にすることに注意してください。壊れているのはインデックスだけです。今日は Angular JS を使用する最初の日なので、忘れていた単純なものがあることを願っています。これは簡単に修正できます。私は何を間違っていますか?

4

1 に答える 1

1

あなたのコードで plunkr を作成しました: http://plnkr.co/edit/ajHZ04yqnBmKHUicWmgb?p=preview - 少し修正しました。

IE を使用してローカル PC で同じコードベースを表示すると、IE8、9、および 10 で同じように実行されます。IE7 ではまったく実行されません。

残念ながら、plunkr は IE8 または 9 をサポートしているとは思わないので、コードをファイルに貼り付けて、違いがあるかどうかを確認してください。

于 2013-08-24T04:43:47.983 に答える