Angular dynamic template with controller

时间:2016-02-12 20:08:53

标签: angularjs

I am trying to add a template with a controller using a directive:

<div directOne>
</div>  

Directive:

a.directive("direct-one", function ($templateRequest, $compile, $controller) {
return {
    link: function (scope, elem, attrs) {
        $templateRequest("template.html").then(function (html) {
            var $scope = scope.$new();
            $controller('oneController', {$scope, $scope});
            var template = angular.element(html);
            $(elem).append(template);
            template = $compile(template)(scope);
        });
    }
  };
});

template:

<span ng-bind="test"></span>
<div ng-controler="oneController">
</div>

controller:

app.controller('oneController', function () {
   $scope.test = '123456';
}

My problem that is the test value is not shown.

I have seen some working samples of what I am doing. My real code is more complex.

Hope, someone can help me.

Thanks

Update 1 My code should look like this then:

<div  style="width:90%;height:100%">
     <div ng-controler="oneController" directOne>        
</div>    

And that code is a part of another template with its own controller. So, unless I have $scope.test on the parent controller the data is not shown.

2 个答案:

答案 0 :(得分:1)

You need to wrap the Controller div around anything that accesses your controller. So it should be:

db.collection.ensureIndex( { field1: 1, field2: 1, field3: 1 } )

答案 1 :(得分:1)

You need to do exactly opposite of what you are currently doing.

While defining directive you should name it as import sys import serial import time import serial.tools.list_ports from PyQt4 import QtGui from window_test import Ui_MainWindow class Main(QtGui.QMainWindow): def __init__(self): QtGui.QMainWindow.__init__(self) self.ui = Ui_MainWindow() self.ui.setupUi(self) self.ui.btn_laser_poweron.clicked.connect(self.btnFIRE) self.ui.btn_laser_poweroff.clicked.connect(self.btnOFF) self.ui.btn_lig_power.clicked.connect(self.btnLIG) self.ui.btn_cutting_power.clicked.connect(self.btnCUT) self.ui.btn_power_meter.clicked.connect(self.btnTEST) self.ui.spinBox.valueChanged.connect(self.PwrLevel) self.ui.comboBox.activated.connect(self.srlprt) def srlprt(self): serial.Serial(str(self.ui.comboBox.currentText())) def btnFIRE(self): ser.write("a" + chr(255)) def btnOFF(self): ser.write("b" + chr(0)) def btnTEST(self): ser.write("c" + chr(0)) time.sleep(59.5) ser.write("d" + chr(255)) def btnLIG(self): ser.write("e" + chr(29)) def btnCUT(self): ser.write("f" + chr(160)) def PwrLevel(self): val = self.ui.spinBox.value() ser.write("g" + chr(val)) if __name__ == '__main__': app = QtGui.QApplication(sys.argv) window = Main() window.show() sys.exit(app.exec_()) & then use that directive with directOne separated value instead of Upper case letter like -.

direct-one value haven't evaluated because you attached controller to directive DOM.

For fixing your issue, you need to compile your new ng-bind="test" element with template.html scope, then will be able to evaluate the value of $controller('oneController', {$scope, $scope}); variable.

Otherwise you could easily fix this by using directive test option.

Markup

controller

Directive

<div direct-one></div>