Question

我正在尝试对hprizon进行一些更改，因此我拥有了源，并试图对base.html进行了一些更改，我创建了一个自定义指令并将其添加到html代码中，但未呈现。经过一些修改后，这里是base.html：

{% load branding i18n %}
{% load context_selection %}
{% load breadcrumb_nav %}



<!DOCTYPE html>
<html>
<head>
<meta content='IE=edge' http-equiv='X-UA-Compatible' />
<meta content='text/html; charset=utf-8' http-equiv='Content-Type' />
<meta name="viewport" content="width=device-width, initial-scale=1">
{% include "horizon/_custom_meta.html" %}
<title>{% block title %}{% endblock %} - {% site_branding %}</title>
{% comment %} Load CSS sheets before Javascript  {% endcomment %}
{% block css %}
  {% include "_stylesheets.html" %}
{% endblock %}
{% iframe_embed_settings %}
{% include "horizon/_conf.html" %}
{% include "horizon/client_side/_script_loader.html" %}
{% include "horizon/_custom_head_js.html" %}
{% block ng_route_base %} {% endblock %}
</head>
<body id="{% block body_id %}{% endblock %}" ng-app='horizon.app' ng-strict- 
 di>
<noscript>
<div class="alert alert-danger text-center javascript-disabled">
{% trans "This application requires JavaScript to be enabled in your web 
browser." %}
</div>
</noscript>
{% block content %}
  <div class='topbar'>
    {% include "header/_header.html" %}
  </div>
  <div id='main_content'>
    {% include "horizon/_messages.html" %}
    {% block sidebar %}
      {% include 'horizon/common/_sidebar.html' %}
    {% endblock %}
    <hr>
    <!--<h1> my customization </h1>-->

      <!--&lt;!&ndash;<script src="./angular/angular_templates.js"> 
   </script>&ndash;&gt;-->
      <!--&lt;!&ndash;<script src="reactDirective.js"></script>&ndash;&gt;-- 
>
    <!--<div ng-app="horizon.app">-->
      <!--{% block sidebar1 %}-->
      <!--{% include './tst.html' %}-->
      <!--{% endblock %}-->
    <!--<my-directive></my-directive>-->
    <h1>custom</h1>
    <body ng-app='myApp'>
    <my-directive connection='"{{console_url}}"' protocols='{{protocols}}'> 
     </my-directive>
    </body>


    <!--</div>-->
            <hr>
    <div id='content_body'>
      <div class='container-fluid'>
        <div class="row">
          <div class="col-xs-12">
            <div class="page-breadcrumb">
              {% block breadcrumb_nav %}
                {% breadcrumb_nav %}
              {% endblock %}
            </div>

            {% block page_header %}
              {% include "horizon/common/_page_header.html" with 
  title=page_title %}
            {% endblock %}
            {% block main %}{% endblock %}
          </div>
        </div>
      </div>
    </div>
  </div>
  {% endblock %}
<div id="footer">
  {% block footer %}
    {% include "_footer.html" %}
  {% endblock %}
</div>
{% block js %}
  {% include "horizon/_scripts.html" %}
{% endblock %}
<div id="modal_wrapper"></div>
</body>
</html>

这是我尝试添加的自定义指令。 my-directive.directive.js：

 (function() {
    'use strict';

        console.log('INDIRECTIVE');


     angular
        .module('MyApp', []).directive('myDirective', directive)
      .directive('myDirective', directive);
      directive.$inject = ['$timeout'];

       function directive( $timeout) {
        return {
            scope: true,
            template: '<h1>hello</h1>',
            restrict: 'E',

        }

       }
      }());

开放堆栈地平线开发

0 个答案: