AngularJS中的first，ng-include或ng-repeat是什么？

Question

If I've got some template with ng-repeat inside and include it with ng-include, what actually will happen? Template with completed ng-repeat will be included, or template without completed ng-repeat (and after include ng-repeat will be completed)?

Answer 1

ngInclude directive first attach the html that return from the template to the html DOM. Then it compiles it's content.

As you can see in the source code of the ngInclude

// This directive is called during the $transclude call of the first `ngInclude` directive.
// It will replace and compile the content of the element with the loaded template.
// We need this directive so that the element content is already filled when
// the link function of another directive on the same element as ngInclude
// is called.
var ngIncludeFillContentDirective = ['$compile',
  function($compile) {
    return {
      restrict: 'ECA',
      priority: -400,
      require: 'ngInclude',
      link: function(scope, $element, $attr, ctrl) {
        if (/SVG/.test($element[0].toString())) {
          // WebKit: https://bugs.webkit.org/show_bug.cgi?id=135698 --- SVG elements do not
          // support innerHTML, so detect this here and try to generate the contents
          // specially.
          $element.empty();
          $compile(jqLiteBuildFragment(ctrl.template, document).childNodes)(scope,
              function namespaceAdaptedClone(clone) {
            $element.append(clone);
          }, {futureParentElement: $element});
          return;
        }

        $element.html(ctrl.template);
        $compile($element.contents())(scope);
      }
    };
  }];

Look at the rows

    $element.html(ctrl.template);
    $compile($element.contents())(scope);

It means it first add it to the DOM, and then compile it.

In the bottom line, You described it as

It's a template without completed ng-repeat (and after include ng-repeat will be completed)