Ich brauche einen Tree als Aggregation in meinem Projekt. Ich finde etwas darüber, wie man sie erreicht. Aber ich habe immer noch ein Problem ... Jedesmal, mag ich die Methode aufzurufen setTitle
des Baumes bekam ich eine Ausnahme: Uncaught TypeError: Cannot read property 'setTitle' of null
Komponenten und Aggregationen in SAPUI5
Mein Code sieht wie folgt aus:
sap.ui.core.UIComponent.extend("ui5_i.myComponent.Component", {
metadata : {
includes: ["../../resources/css/org-struct.css"],
properties : {
treeTitle: "string",
searchPlaceholder: "String",
showId: { type:"boolean", defaultValue: true },
data: "object",
height :"string",
width: "string"
},
aggregations: {
_Tree : {type:'sap.ui.commons.Tree', multiple: false}
}
},
createContent: function(){
console.log("createContent!");
this.set_Tree(new sap.ui.commons.Tree());
....
.... here comes the rest of the view
}
Und meine Setter-Methode:
ui5_i.myComponent.Component.prototype.setTreeTitle = function(sTitle) {
if(typeof(sTitle) === "string" && sTitle != undefined && sTitle !=null){
this.setProperty("treeTitle", sTitle);
this.get_Tree().setTitle(sTitle);
return this;
}else{
throw("Property 'treeTitle' is not of type 'string' or 'undefined'!");
}
ich verstehe nicht den Fehler, weil der Inhalt erstellt wird, so dass der Baum kann null
nicht sein, ich selbst den Baum sehen, wenn ich die Setter-Methode Kommentar, so kann ich normalerweise die setTitle Methode aufrufen .. Jemand eine Idee, was schief läuft?
EDIT: Ich erkannte, dass mein _Tree immer Null ist, aber ich habe den Setter verwendet, um es zu initialisieren ... Ich änderte es auch und legte die Init des Baumes in meine init() Methode, aber als ich will den Baum Ansicht hinzufügen und einen Fehler wie folgt erhalten: Uncaught TypeError: Cannot read property 'addDelegate' of null
Hier ist der gesamte Code:
jQuery.sap.require("sap.ui.core.UIComponent");
jQuery.sap.require("sap.ui.commons.Tree");
jQuery.sap.declare("ui5_i.myComponent.Component");
sap.ui.core.UIComponent.extend("ui5_i.myComponent.Component", {
metadata : {
includes: ["../../resources/css/org-struct.css"],
properties : {
treeTitle: "string",
searchPlaceholder: "String",
showId: { type:"boolean", defaultValue: true },
data: "object",
height :"string",
width: "string"
},
aggregations: {
_oTree : {type:'sap.ui.commons.Tree', multiple:false }
}
},
init : function (){
sap.ui.core.UIComponent.prototype.init.apply(this, arguments);
var oSearchSettings = new sap.ui.model.json.JSONModel({
"partially_search": "true",
"case_sensitive": "true",
"searchedText": "",
"aSearchResults" : [],
"indexOfSearchResults": "0"
});
sap.ui.getCore().setModel("settings", oSearchSettings);
this.set_oTree(new sap.ui.commons.Tree());
},
createContent: function(){
var oResponsiveLayout = new sap.ui.layout.form.ResponsiveGridLayout({columnsL: 3,columnsM: 2, columnS: 1});
var oFormLayout = new sap.ui.layout.form.Form({
width: this.getProperty("width"),
height: this.getProperty("height"),
layout: oResponsiveLayout,
formContainers: [ new sap.ui.layout.form.FormContainer({
formElements: [new sap.ui.layout.form.FormElement({
fields: [ this.oSearchField = new sap.ui.commons.SearchField({
placeholder : "Suchtext/ID",
search: this._onSearchRequest,
layoutData: new sap.ui.layout.GridData({span: "XL8 L8 M8 S8"})
}), this.oArrowUp = new sap.ui.commons.Button({
width: "40px",
icon: "resources/images/arrow_up.png",
layoutData: new sap.ui.layout.GridData({span: "XL1 L1 M1 S1"})
}), this.oArrowDown = new sap.ui.commons.Button({
width: "40px",
icon: "resources/images/arrow_down.png",
layoutData: new sap.ui.layout.GridData({span: "XL1 L1 M1 S1"})
}),
this.oSettingsMenuButton = new sap.ui.commons.MenuButton({
height: "80%",
width: "50px",
icon: "resources/images/settings.png",
lite: true,
layoutData: new sap.ui.layout.GridData({span: "XL2 L2 M2 S2"}),
menu: new sap.ui.unified.Menu({
items: [ new sap.ui.unified.MenuItem({
text: "ID",
submenu: new sap.ui.unified.Menu({
items: [ this.oIdMenuButton = new sap.ui.unified.MenuItem({
text: "IDs anzeigen/ausblenden",
icon: "resources/images/check.png",
select: this._onShowHideIdRequest
})]
})
}), new sap.ui.unified.MenuItem({
text: "Suche",
submenu: new sap.ui.unified.Menu({
items: [ new sap.ui.unified.MenuItem({
text: "Teilsuche aktivieren/deaktivieren",
icon: "resources/images/check.png",
select: this._onPartiallySearchRequest
}), new sap.ui.unified.MenuItem({
text: "Groß- und Kleinschreibung beachten/ignorieren",
icon: "resources/images/check.png",
select: this._onCaseSensitiveRequest
})]
})
})]
})
}) ]
}),new sap.ui.layout.form.FormElement({
fields: [ this.get_oTree()]
})]
})]
});
return oFormLayout;
},
_bindData : function(){
var oJsonModel = new sap.ui.model.json.JSONModel(this.getProperty("data"));
this.getAggregation('_oTree').setModel(oJsonModel,"org_structJSON");
this._loadNodes();
},
_loadNodes: function(){
var rootPath = this._getRootPath();
var aParentID = [];
for(key in rootPath){
var parentID = rootPath[key].parent;
if(aParentID.indexOf(parentID) < 0){
aParentID.push(parentID);
this._loadChildNodes(parentID);
}
}
},
_getRootPath : function() {
var oJSON = this.oTree.getModel("org_structJSON");
return oJSON.getProperty("/ORG_UNITS");
},
_loadChildNodes : function(parentID) {
var rootPath = this._getRootPath();
if(parentID === ""){
for(key in rootPath){
var node = rootPath[key];
if(node.parent === parentID){
var rootNode = this._createNode(node.id, node.short_text);
this.getAggregation(_oTree).addNode(rootNode);
}
}
}else{
var aNodes = this.oTree.findAggregatedObjects(true);
for(var index = 0; index < aNodes.length; index++){
var nodeID = aNodes[index].getId();
if(nodeID.slice(1,nodeID.length) === parentID){
for(key in rootPath){
if(rootPath[key].parent === parentID){
var oChildNode = this._createNode(rootPath[key].id, rootPath[key].short_text);
aNodes[index].addNode(oChildNode);
}
}
}
}
}
},
_createNode : function(id, short_text) {
var oNode = new sap.ui.commons.TreeNode({
id : "_" + id,
icon : "resources/images/organisation_unit.gif",
expanded: false
});
if(window.showId){
oNode.setText(short_text + " (" + id + ")");
}else{
oNode.setText(short_text)
}
return oNode;
},
_onSearchRequest : function(oControlEvent) {
},
_onShowHideIdRequest : function(){
},
_onPartiallySearchRequest : function(){
},
_onCaseSensitiveRequest : function(){
}
});
ui5_i.myComponent.Component.prototype.setTreeTitle = function(sTitle) {
if(typeof(sTitle) === "string" && sTitle != undefined && sTitle !=null){
this.setProperty("treeTitle", sTitle);
this.get_oTree().setTitle(sTitle);
return this;
}else{
throw("Property 'treeTitle' is not of type 'string' or 'undefined'!");
}
},
ui5_i.myComponent.Component.prototype.setData = function(oData) {
if(typeof(oData) === "object" && oData != undefined && oData !=null){
this.setProperty("data", oData);
this._bindData();
return this;
}else{
throw("Property 'data' is not of type 'object' or undefined!");
}
},
ui5_i.myComponent.Component.prototype.setSearchPlaceholder = function(sText) {
if(typeof(sText) === "string" && sText != undefined && sText !=null){
this.setProperty("searchPlaceholder", sText);
this.oSearchField.setPlaceholder(sText);
return this;
}else{
throw("Property 'searchPlaceholder' is not of type 'string' or 'undefined!'");
}
}
Bedeutet Ihre Bearbeitung, dass Sie Ihre Antwort gefunden haben? Wenn dies der Fall ist, sollten Sie es als tatsächliche Antwort auf die Frage veröffentlichen. – hirse
Nein, ich habe keine Lösung – Chris
In Ihrem Code scheint es, dass 'get_Tree' null zurückgibt, können Sie diese Methode in Ihre Frage aufnehmen? – hirse