Question

我的Ember代码未将子视图绑定到ContainerView Controller

下的控制器

我有一个模板“指标”，MetricsView没有从其控制器中提取标题属性值。这是容器视图下的子视图，与containerview下的所有其他视图相同。

以下是我正在使用的代码片段：

这就是我的容器视图的样子

// Container View
App.DashboardContainerView = Ember.ContainerView.create({
    childViews: [],
    view1: App.MetricsView,
    view2: App.ResultsView,
});

这就是我的Child视图的样子： App.MetricsView = Ember.View.create（{ 模板：Ember.TEMPLATES [“metrics”] }）;

这就是我的Child View容器的样子： //未与子视图绑定的子视图控制器， //想要从这个Controller渲染标题到模板

App.MetricsController = Ember.ObjectController.extend({
    title: 'Metrics Page', // To Be deleted later
    content : []
    metrics : [],

    view: Ember.View.create({
      templateName: 'metrics'
    }),

    show : function(petId, onDone, onFail) {
        _get('/fetch_one', onDone, onFail);
    },
});

子模板//此处{{title}}未在UI上打印，但“ - 摘要”打印

<script type="text/x-handlebars" data-template-name="metrics">
    <div class='well well-large'>
        <div class="container">
            <div class="row">
                <div class="span9">
                    <h4>{{title}}</h4>
                    <h4> -- Summary</h4>
                </div>
                <div class="span1">
                    <button {{action "toggle" }} class="close">&times;</button>
                </div>
            </div>
        </div>
    </div>
</script>

其他一些受支持的代码：

var App = Ember.Application.create({
    appName: 'Portal',
    debug: true,
    demomode: 1,
    version: '0.0.1'
});

App.Router.map (function () {
    this.resource('pets');
    this.resource('pet', {path: ':pet_id'}, function(){
        this.resource('dashboard');
        this.resource('list', function() {
            this.route('summary');
            this.route('results');
        });
    });
});

//ApplicationRoute
App.ApplicationRoute = Ember.Route.extend({
    setupController: function(){
    },
});

App.IndexRoute = Ember.Route.extend({
    redirect : function() {
        this.transitionTo('pets');
    }
});


App.PetsRoute = Ember.Route.extend({
    model: function() {
        return App.Pet.find();
    },
    renderTemplate: function () {
        this.render({ outlet: 'rightpane' });
    }
});


App.PetsController = Ember.ArrayController.extend({
    sortProperties : [ 'first_name' ],
    sortAscending : true
});

App.DashboardRoute = Ember.Route.extend({
    setupController: function(){
        var menuItems;
        if (App.DashboardContainerView.get('childViews')) {
            App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
            App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view2);

            menuItems = this.controllerFor('petDashboardMenu').get('model');
            $(menuItems).each(function(index, menuItem) {
                if (menuItem.id == 1 || menuItem.id == 2) {
                    alert(menuItem);
                }
            }); //TODO: Make the menu buttons active for which view is added.
        }

        //this.controllerFor('pets').set('model', App.Preference.find({ name: "Dennis" }));
        this.controllerFor('petDashboardMenu').set('model', App.PetMenuItem.find());
    },
    renderTemplate: function () {
        this.render({ outlet: 'rightpane' });
    }
});

App.DashboardController = Ember.ObjectController.extend({
    name: 'Dashboard'
});

App.PetDashboardMenuController = Ember.ArrayController.extend({
    toggleMenuItem: function(menuItem) {
        var link = $(event.srcElement);
        var childViews = App.DashboardContainerView.get('childViews');
        if (link.hasClass('active')) {
            link.removeClass('active');
            var present = false;
            switch (link.text()) {
                case 'Summary':
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
                    break;
                case 'Results':
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view2);
                    break;
                default:
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
            }
            if(present >= 0) {
                // ToDo : For All Menu Items
                switch (link.text()) {
                    case 'Summary':
                        App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view1);
                        break;
                    case 'Results':
                        App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view2);
                        break;
                    default:
                        App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view1);
                }
                App.log('Removed Summary : Removed : View Count : ' + App.DashboardContainerView.get('childViews').length);
            } else {
                App.log('Removed Summary : Already Not Present : View Count : ' + App.DashboardContainerView.get('childViews').length);
            }
        } else {
            link.addClass('active');
            var present = null;
            App.log('Link Text : "' + link.text() + '"');
            switch (link.text()) {
                case 'Summary':
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
                    break;
                case 'Results':
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view2);
                    break;
                default:
                    present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
            }

            if(present >= 0) {
                App.log('Adding Summary : Already Present : View Count : ' + App.DashboardContainerView.get('childViews').length);
            } else {
                // ToDo : For All Menu Items
                switch (link.text()) {
                    case 'Summary':
                        App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
                        break;
                    case 'Results':
                        App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view2);
                        break;
                    default:
                        App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
                }
                App.log('Added Summary : View Count : ' + App.DashboardContainerView.get('childViews').length);
            }
        }
    }
});

App.log = function(message) {
    if(App.debug) {
        console.log(message);
    }
};

任何指针都会受到赞赏吗？

Answer 1

当我发现该功能已被弃用时，我遇到了这个问题的困难。我收到了以下警告：

通过其childViews属性操作Ember.ContainerView是弃用。请使用ContainerView实例本身作为 Ember.MutableArray。

您需要将pushObject用作documentation状态。

ember.js containerview视图控制器绑定不起作用

1 个答案: