在另一个Javascript文件的数组中搜索项目（使用了AngularJS）

Question

我是AngularJS的新手。 我决定用我定义的标记创建一个自定义地图。 因此，我创建了一个仅包含数组的javascript文件：

var myMarkers=[{
   method1='..',
   methode2='..'
 },{
   method1='..',
   methode2='..'
}]

然后，我创建了一个app.s文件，该文件是用于创建地图的AngularJS指令

angular.module('myApp', []).
directive('myMap', function() {
   var link = function(scope, element, attrs) {
       function initMap(){..};   
       function setMarker(map, position, title, content,link){..};
       function returnMarker(){..};
   }
   return {
        restrict: 'A',
        template: '<div id="gmaps"></div>',
        replace: true,
        link: link
    };
});

在我的index.html中，

<html ng-app="myApp">
<head>...</head>
<body>
<div my-map=""></div>
</body>
</html>

它工作正常，但我想添加一个研究功能以找到一个标记，然后将地图放在该标记的中心。 像这样的东西：

<input type="search" placeholder="Search your place" ng-model='search'></input>
<p ng-repeat="marker in myMarkers| filter: search> {{marker.title}}</p>

预先感谢您的任何帮助

Answer 1

我相信您在要求三件事：1）从控制器中的另一个文件访问数组。 2）对标记进行过滤/搜索。 3）如何使地图在标记上居中。

要将阵列存储在另一个文件中并在控制器中访问它，请执行以下操作：

-mymarkers.js

var app = angular.module('myApp');
app.constant("myMarkers", [{
   method1='..',
   methode2='..'
 },{
   method1='..',
   methode2='..'
}]);

-app.js文件

var app = angular.module('myApp', []);
angular.module('myApp').controller("myController", ["$scope", "myMarkers", function($scope, myMarkers){
    $scope.markers= myMarkers; 
    $scope.searchMarkers = function(){
// loop through your markers array and compare with the entered value in text box.
    }
}]);

app.directive('myMap', function() {
   var link = function(scope, element, attrs) {
       function initMap(){..};   
       function setMarker(map, position, title, content,link){..};
       function returnMarker(){..};
   }
   return {
        restrict: 'A',
        template: '<div id="gmaps"></div>',
        replace: true,
        link: link
    };
});

app.filter('marksersFilter', function () {
        return function (objects, markerObj) {
            if (!objects)
                return [];
            else if (!(markerObj))
                return objects;
            else {
                var result = [];
                for (var i = 0; i < objects.length; i++) {
                    // do comparision here, if found push object to result array
                            result.push(objects[i]);                        
                }
                return result;
            }
        }
    });

-index.html

<html ng-app="myApp" ng-controller="myController">
<head>...</head>
<body>
   <input type="search" ng-change="searchMarkers()" placeholder="Search your place" ng-model='search'></input>
<p ng-repeat="marker in myMarkers| marksersFilter: search"> {{marker.title}}</p>

<div my-map=""></div>
</body>
</html>

我希望这回答了您有关如何“使用Angular搜索另一个JS文件的数组中的项目）的问题

在另一个Javascript文件的数组中搜索项目（使用了AngularJS）

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-03-15 17:18:48

在另一个Javascript文件的数组中搜索项目（使用了AngularJS）

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-03-15 17:18:48

解决方案1
0 已采纳 2016-03-15 17:18:48