javascript - selectedElement不显示Angular 1服务AngularJS

标签 javascript angularjs service

我目前正在 youtube 上浏览 angularjs 1 服务教程,但我陷入了以下困境。

youtube link

我正在尝试让selectedElement显示在我的index.html文件中

使用以下代码时显示该值:

{{ sensormeasurements[0].sensorMeasurementID }}

但是以下任何组合都不会。

{{ selectedElement.sensorMeasurementID }}
{{ sensormeasurements.selectedElement.sensorMeasurementID }}
{{ fishHouseMonitorController.selectedElement.sensorMeasurementID }}
{{ $scope.selectedElement.sensorMeasurementID }}

关于使 selectedElement.sensorMeasurementID 显示在我的 HTML 页面上的正确语法有什么想法吗?

感谢您对此的帮助。 史蒂夫

我的 app3.js 文件中有以下代码

var app = angular.module('fishHouseMonitorApp', []);

app.controller('fishHouseMonitorController', function($scope, $http) {
  $http.get("http://www.eastcentralmdaa.org/fishhousemonitor/api/v1/sensormeasurements")
    .then(function(response) { 
        $scope.sensormeasurements = response.data; });
        // do some error checking to ensure there is an element 0?
        $scope.selectedElement = $scope.sensormeasurements[0];
    }
);

我的 index.html 文件中有以下代码

<!DOCTYPE html>
    <html>
        <head>
            <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
            <script src="app2.js">app3.js</script>
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
        </head>
        <body>
            <div class="container" ng-app="fishHouseMonitorApp" ng-controller="fishHouseMonitorController">
                <div class="row">
                    <ul class="list-group">
                        <li class="list-group-item" ng-repeat="sensormeasurement in sensormeasurements" ng-click="selectContact($index)">
                            <span>{{ sensormeasurement.sensorMeasurementDateTime }}</span>
                        </li>
                    </ul>
                </div>
                <div class="row">
                    <div class="media">
                        <div class="media-left">
                            <img src="../img/sensor.png" />
                        </div>
                        <div class="media-body">
                            <!-- <h4 class="media-heading">{{ sensormeasurements[0].sensorMeasurementID }}</h4> -->
                            <h4 class="media-heading">{{ selectedElement.sensorMeasurementID }}</h4> 
                            <div>
                                <p>
                                    <h4>sensorMeasurementID</h4>
                                <p>
                                    {{ selectedElement.sensorMeasurementID }}
                                    {{ sensormeasurements.selectedElement.sensorMeasurementID }}
                                    {{ fishHouseMonitorController.selectedElement.sensorMeasurementID }}
                                    {{ $scope.selectedElement.sensorMeasurementID }}
                                    {{ sensormeasurements[0].sensorMeasurementID }}
                                </p>
                            </div>
                            <div>
                                <p>
                                    <h4>userSystemSensorID</h4>
                                <p>
                                    {{ sensormeasurements[0].userSystemSensorID }}
                                </p>
                            </div>
                            <div>
                                <p>
                                    <h4>sensorMeasurementDateTime</h4>
                                <p>
                                    {{ sensormeasurements[0].sensorMeasurementDateTime }}
                                </p>
                            </div>
                            <div>
                                <p>
                                    <h4>sensorMeasurementValue</h4>
                                <p>
                                    {{ sensormeasurements[0].sensorMeasurementValue }}
                                </p>
                            </div>
                        </div>
                    </div>                    
                </div>
            </div>
        </body>
    </html>

最佳答案

我发现了我的错误。

<script src="app2.js">app3.js</script>

我修改了错误的文件...

关于javascript - selectedElement不显示Angular 1服务AngularJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47402955/

相关文章:

javascript - 从单独的 Controller 访问指令范围

android - 调用 Service stopSelf() 后未调用 onServiceDisconnected()

java - 服务不接收多媒体按钮单击事件

javascript - jQuery 褪色 "back to top"链接。页面加载链接可见性

javascript - 使用搜索过滤器 Bootstrap 时如何 float div

javascript - 使用 KnockoutJs 跟踪初始映射的最佳方法

javascript - Gulp connect 给我无法 GET/with Angular 应用程序

javascript - 如何查看特定 JS 对象的可达性

javascript - ng-repeat 的列表源调用了太多次

grails - 在脚本中使用 Grails 服务