8
0
Просмотр исходного кода

Fixed: View bind.if bindings don't work when used in complex (array) bindings.

Aleksander Nowodzinski 9 лет назад
Родитель
Сommit
07726c75ff
2 измененных файлов с 43 добавлено и 9 удалено
  1. 18 9
      packages/ckeditor5-ui/src/view.js
  2. 25 0
      packages/ckeditor5-ui/tests/view.js

+ 18 - 9
packages/ckeditor5-ui/src/view.js

@@ -473,7 +473,11 @@ export default class View {
 						modelValue = schemaItem.callback( modelValue, node );
 					}
 
-					return modelValue;
+					if ( schemaItem.type === bindIfSymbol ) {
+						return !!modelValue ? schemaItem.valueIfTrue || true : '';
+					} else {
+						return modelValue;
+					}
 				} else {
 					return schemaItem;
 				}
@@ -498,20 +502,22 @@ export default class View {
 			// A function executed each time bound model attribute changes.
 			const onModelChange = () => {
 				let value = getBoundValue( node );
+				let shouldSet;
 
 				if ( isPlainBindIf ) {
 					value = value[ 0 ];
+					shouldSet = value !== '';
+
+					if ( shouldSet ) {
+						value = value === true ? '' : value;
+					}
 				} else {
 					value = value.reduce( binderValueReducer, '' );
+					shouldSet = value;
 				}
 
-				const isSet = isPlainBindIf ? !!value : value;
-
-				const valueToSet = isPlainBindIf ?
-					( valueSchema[ 0 ].valueIfTrue || '' ) : value;
-
-				if ( isSet ) {
-					domUpdater.set( valueToSet );
+				if ( shouldSet ) {
+					domUpdater.set( value );
 				} else {
 					domUpdater.remove();
 				}
@@ -709,7 +715,10 @@ function hasModelBinding( valueSchema ) {
  * @returns {String}
  */
 function binderValueReducer( prev, cur ) {
-	return prev === '' ? `${cur}` : `${prev} ${cur}`;
+	return prev === '' ?
+			`${cur}`
+		:
+			cur === '' ? `${prev}` : `${prev} ${cur}`;
 }
 
 /**

+ 25 - 0
packages/ckeditor5-ui/tests/view.js

@@ -607,6 +607,31 @@ describe( 'View', () => {
 				expect( view.element.outerHTML ).to.equal( '<p>bar</p>' );
 			} );
 
+			it( 'allows binding attribute to the model – array of bindings (HTMLElement attribute)', () => {
+				setTestViewClass( function() {
+					const bind = this.attributeBinder;
+
+					return {
+						tag: 'p',
+						attributes: {
+							'class': [
+								'ck-class',
+								bind.if( 'foo', 'foo-set' ),
+								bind.if( 'bar', 'bar-not-set', ( value ) => !value ),
+								'ck-end'
+							]
+						},
+						children: [ 'abc' ]
+					};
+				} );
+
+				setTestViewInstance( { foo: true, bar: true } );
+				expect( view.element.outerHTML ).to.equal( '<p class="ck-class foo-set ck-end">abc</p>' );
+
+				view.model.foo = view.model.bar = false;
+				expect( view.element.outerHTML ).to.equal( '<p class="ck-class bar-not-set ck-end">abc</p>' );
+			} );
+
 			it( 'allows binding attribute to the model – value of an attribute processed by a callback', () => {
 				setTestViewClass( function() {
 					const bind = this.attributeBinder;