I'm developing my own tag in angular.js.
my definition is:
var mainApp = angular.module("mainApp", []); mainApp.directive('tabela', function() { var directive = {}; directive.restrict = 'E'; directive.template = '<div id="container_{{name}}" style="background:white; border: 1px solid ; width: 250px; height: 250px;overflow: hidden;vertical-align: baseline"> \ <div id="titleBar_{{name}}" style="width: 100%;border-bottom: 1px solid;display: flex;"> \ <div id="text_{{name}}" style="width: 50%; float: left;"> \ {{tabela}} \ </div> \ <div id="button_{{name}}" style="width:50%; float: right;" align="center"> \ <button type="button" id="addField_{{name}}">add field</button> \ </div> \ </div> \ <!--<hr style="width: 100%">--> \ \ <div id="fieldList_{{name}}"> \ <div ng-repeat="camp in campos" id="field_{{name}}"> \ <span id="text" style="width: 50%; float: left;"> \ {{camp.campo}} \ </span> \ <span id="button_{{name}}" style="width:50%; float: right;" align="center"> \ {{camp.tipo}} \ </span> \ </div> \ </div> \ </div>'; directive.scope = { name:"@name", tabela:"@tabela", campos:"=" } directive.compile = function(element, attributes) { var linkFunction = function($scope, element, attributes) { } return linkFunction; } return directive; }); mainApp.controller('TabelasController', function ($scope,testService) { function Init() { $scope.data = {}; testService.getData().then(function(data) { $scope.tabelas=data.data; }); } Init(); }); mainApp.service('testService', function ($http) { this.getData = function () { return $http.get('data.json'); } }); I have the following json file
[{ "name": "tab1aaa", "tabela": "tabela1aaa", "campos":[{"campo":"campo1aaa1","tipo":"integer"},{"campo":"campo1aaa2","tipo":"varchar"}]}, { "name": "tab2bbb", "tabela": "tabela2bbb", "campos":[{"campo":"campo2bbb1","tipo":"integer"},{"campo":"campo2bbb2","tipo":"varchar"}]}] In the main html file I have a call to the tag like this
<tabela ng-repeat="tab in tabelas" name="{{tab.name}}" tabela="{{tab.tabela}}" campos="[{campo:'campo1A',tipo:'integer'},{campo:'campo2A',tipo:'varchar'}]" class="tabela ui-widget-content"></tabela> This works fine but I want to make a call like this
<tabela ng-repeat="tab in tabelas" name="{{tab.name}}" tabela="{{tab.tabela}}" campos="{{tab.campos}}" class="tabela ui-widget-content></tabela> but it gives me the following error
What am I doing wrong? How can I debug both ng-repeat the one in the page and the one in the custom directive?
Thanks
