要动态改变mat-form-field的外边框颜色，可以使用Angular的样式绑定功能和CSS变量。以下是解决方法的代码示例：

首先，在组件的CSS文件中定义一个CSS变量，用于存储边框颜色值：

:host {
  --border-color: #ccc; /* 默认边框颜色 */
}

然后，在模板文件中，使用样式绑定将CSS变量应用到mat-form-field的边框颜色上：

接下来，在组件的TypeScript文件中，定义一个方法来返回边框颜色值，该方法可以根据需要动态改变颜色：

import { Component } from '@angular/core';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  // 定义变量用于存储边框颜色值
  borderColor = '#ccc';

  // 返回边框颜色值
  getBorderColor() {
    return this.borderColor;
  }

  // 在某个事件中改变边框颜色
  changeBorderColor() {
    this.borderColor = 'red'; // 可以根据需要改变颜色值
  }
}

最后，通过调用changeBorderColor()方法可以在某个事件中动态改变边框颜色。例如，可以在按钮的点击事件中调用该方法：

改变边框颜色

这样，当点击按钮时，mat-form-field的边框颜色将会改变为红色。