Question

我在我的应用程序中使用谷歌地图，我在脚本标签中使用地图相关代码，在搜索结果后，它给出了经度，纬度，我得到这些值并在输入中显示这些值

这是我的一部分脚本代码，它将lon和lat传递给输入

 document.getElementById('lat').value = place.geometry.location.lat();

    document.getElementById('lng').value = place.geometry.location.lng();

这是我的HTML代码

<div class="from-group">
<li>Latitude: <input class="from-control" ng-model="formData.lat" id="lat"></li>
<li>Longitude: <input class="from-control" ng-model="formData.lng" id="lng" ></li>
<button class="btn btn-primary" ng-click="values()" id="idbtn" >Results</button>
</div>

但它为ng-model =＆＃34; formData.lng＆＃34;提供了未定义的内容。当我进入一些东西手动它工作正常，但当值来自脚本时，它提供未定义的

这是我的控制器代码

Sscope.formData={}; 
    $scope.values = function () {

    console.log($scope.formData.lat);
    console.log($scope.formData.lng);
};

Answer 1

使用

从javascript文件传递lat和long时

document.getElementById('lat').value = place.geometry.location.lat();
document.getElementById('lng').value = place.geometry.location.lng();

ng-model没有得到更新或触发＆＃39;

尝试

angular.element($('#myInputElement')).triggerHandler('input')

有一篇好的帖子here可能有帮助。

您可以考虑使用Google地图指令，例如ng-map

Answer 2

您需要使用$scope设置$apply变量。

var latElem = angular.element(document.getElementById('lat'))
var latScope = latElem.scope();
latScope.$apply("formData.lat=" + place.geometry.location.lat());

$apply评估一个Angular Expression并启动一个AngularJS摘要周期来更新框架。

从脚本函数到输入字段的值ng-model给出未定义的Angular

2 个答案: