title: Passing array as directive parameter
body: <p>Supposedly, I have a directive with scope</p>
  
  <pre><code>scope: {
     columns: '=',
  }
  </code></pre>
  
  <p>How can I achieve this?</p>
  
  <pre><code>&lt;my-directive columns="[{ field:'id', displayName: 'ID' },
                              { field:'title', displayName: 'Title' },
                              { field:'address', displayName: 'Address' },
                              { field:'city', displayName: 'City' }]" /&gt;
  </code></pre>
  
  <p>Apparently Angular's compiler have problems with figuring out that it's an array, although it doesn't have a problem with standard JS objects passed this way - {}. Is there any nifty way to do this? Does the fact that it works with objects is just a coincidence?</p>
  
  <p>Please keep in mind that <em>I know</em>, that I can set this as $scope parameter in Controller and pass just the parameter name from $scope. But I would really like to learn if it's possible to do it straight from HTML.</p>
  
  <p>--
  Update with full code:</p>
  
  <p>This is how it is used in template</p>
  
  <pre><code>&lt;es-paged-data-grid columns="[
                                  { field:'id', displayName: 'ID' },
                                  { field:'title', displayName: 'Title' },
                                  { field:'address', displayName: 'Address' },
                                  { field:'city', displayName: 'City' }
                              ]"&gt;
  &lt;/es-paged-data-grid&gt;
  </code></pre>
  
  <p>This is the directive:</p>
  
  <pre><code>app.directive('esPagedDataGrid', function () {
      var definition = {
          restrict: "E",
          replace: false,
          transclude: true,
          scope: {
              columns: '=',
          },
          templateUrl: 'application/directive/pagedDataGrid/PagedDataGrid.html',
          controller: ['$scope', '$element', '$attrs', '$transclude', function($scope, $element, $attrs, $transclude) {
  
              var dataGridOptions = {};
  
              if ($scope.columns) {
                  dataGridOptions.columnDefs = $scope.columns;
              }
  
              $scope.dataGridOptions = dataGridOptions;
          }]
      };
  
      return definition;
  });
  </code></pre>
  
  <p>This is the directive's template:</p>
  
  <pre><code>&lt;div ng-grid="dataGridOptions"&gt;
  &lt;/div&gt;
  </code></pre>