Ng-if on指令使用双向绑定覆盖函数

Question

I've set up a directive that will take in a function from the parent controller as one of it's attributes. This function will be replaced by the directives controller and will be accessible by the parent controller by using the passed function. The issue I'm running into is when placing an ng-if attribute on the directive the passed in function is not being replaced anymore. What causes this and how would I go about fixing this issue? I've attached an example

https://jsfiddle.net/dh7jt1zg/1/

    <div class="parent" ng-controller="pCtrl">
        <h3>Parent - with ng-if</h3>
        <div>{{parentHelloWorld()}}</div>
        <child ng-if="testBool" rep-fun="parentHelloWorld"></child>
    </div>
    <br/>
    <div class="parent" ng-controller="pCtrl2">
        <h3>Parent2 - without ng-if</h3>
        <div>{{parentHelloWorld()}}</div>
        <child rep-fun="parentHelloWorld"></child>
    </div>

Answer 1

Use ng-show instead of ng-if . ng-if causes element to remove from the DOM.

Answer 2

I think you'd be better off to create a service instead of replacing the function in the child controller. That seems kind of messy to me.

Personally, I'd use a service to register the function and then you can use that same service from the parent controller to call it.