Welcome to JS Bin

JS Bin

Save
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body ng-app='app'>
    <div ng-controller="Ctrl1">
      請選擇人名：
      <ng-name-div names="names"></ng-name-div>
    </div>
</body>
<script>
function Ctrl1($scope) {
  $scope.names = ['angular','js','man','blackie'];
}
var app = angular.module('app', []);
app.directive('ngNameDiv',function ($compile,$location) {
    var getTemplate=function(names){
            var template='<select ><option ng-repeat="name in names" >{{name}}</option></select>';
            return template;
        },
        linker = function(scope, element, attrs) {
             element.html(getTemplate());
            $compile(element.contents())(scope);
        };
    return {
        restrict: "EA",
        replace: true,
        link: linker,
        scope: {
          names:'='
        }
    };
});  
​
</script>
</script>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x